低代码助力微信小程序对接,提升开发效率
摘要:本文由葡萄城技术团队原创并首发。转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。
前言
微信小程序相信大家都用过,相较于APP,微信小程序的优势在于其便捷性,只需要下载一个微信就可以访问所有的小程序,因此许多开发者也逐渐将自己开发的系统部署到微信小程序上以供更多的人访问。那么使用低代码搭建的系统是否也可以部署到微信小程序上呢?答案是肯定的,下面小编就将以活字格为例为大家介绍如何使用低代码与微信小程序对接。

使用低代码对接微信小程序
活字格对接微信小程序可以分为以下四步:
1.微信小程序注册。
2.低代码配置。
3.低代码与微信小程序对接。
4.发布与部署。
1.微信小程序注册
首先来到微信小程序的注册地址:微信小程序。

然后填写对应的注册信息,并进行注册。
需要注意的是:微信小程序一定要注册为非个人小程序,微信针对此有限制:如果为个人小程序,则web-view在个人类型小程序中无法使用,具体可以参考微信文档:web-view | 微信开放文档 (qq.com)。

账号注册完成后,在左侧菜单中选择《开发》---《开发管理》---《开发设置》中,拿到AppID(小程序ID)和AppSecret(小程序密钥)。

接着在下面《服务器域名》中配置request合法域名,这里的request合法域名需要填写的是上面准备活字格应用发布后的备案合法域名。

除此以外,还要配置对应的《业务域名》,这里的域名还是配置为已备案的https域名。

配置这个域名时,需要下载一个txt的校验文件,然后把这个文件放在域名根目录下,微信验证后就可以了。

2.低代码配置
注册并拿到微信小程序的AppID(小程序ID)和AppSecret(小程序密钥)后,此时我们可以来到我们的活字格设计器及服务管理器中进行配置。
首先使用活字格设计器打开活字格工程,将下面示例工程中的数据表文件夹《MiniProgramConfig》和服务端命令文件夹《微信小程序配置服务端命令》导入到工程中。

导入后,打开表《MiniWechatConfig》,将刚才注册微信小程序时拿到的AppKey和AppSecret进行替换。

然后来到我们的活字格服务管理器,在左侧菜单栏《设置》---《安全设置》---《第三方授权》中,添加客户端授权。

保存后拿到《客户端标识符》和《客户端密钥》后,回到设计器工程中,在表《ForguncyConfig》中,替换对应的client_id,client_secret。
点击图片可查看完整电子表格
3.低代码与微信小程序对接
首先从Gitee仓库中下载微信小程序代码:葡萄城/活字格低代码平台对接微信小程序 (gitee.com)。
然后在微信开发者工具中打开此项目,在user_login.js文件中,填写baseURL、serverURL、client_ID、ssoPassword,如下表:
| 字段 | 值 |
|---|---|
| client_id | <客户端标识符> |
| client_secret | <客户端密钥> |
| scope | FGC_AllAppsServerCommands |
| grant_type | client_credentials |

活字格单点登录流程图:

4.发布与部署
在发布活字格工程时,请确保选择《半覆盖发布》或《全覆盖发布》选项,根据您的需求进行选择。如果您对具体的对接步骤感兴趣,欢迎观看下方视频,其中详细介绍了微信小程序工程代码的大致组成以及发布和部署的方法。
视频链接:
https://cdn.grapecity.com.cn/hzg/videos/小程序集成与发布.mp4
上传代码后,等待微信小程序的审核通过,一旦审核通过并在微信小程序中正常发布后,您的小程序就可以在微信中被搜索到并访问了。

总结
以上就是低代码对接微信小程序的全流程,下面是微信小程序的演示视频:
视频链接:
https://cdn.grapecity.com.cn/hzg/videos/微信小程序演示.mp4
如果您想体验小程序可以直接扫描二维码:

扩展链接:
低代码助力微信小程序对接,提升开发效率的更多相关文章
- 一行代码让微信小程序支持 cookie
weapp-cookie 一行代码让微信小程序支持 cookie,传送门:github Intro 微信原生的 wx.request 网络请求接口并不支持传统的 Cookie,但有时候我们现有的后端接 ...
- 微信小程序的功能开发工具跟公众号的差别,小程序是一种减负思维对简单APP是巨大打击
微信小程序的功能开发工具跟公众号的差别,小程序是一种减负思维对简单APP是巨大打击 摘要: 小程序和公众号最大的区别有如下四点:1.小程序没有粉丝,开发者在后台能看到的只能是累计用户访问数以及实时统计 ...
- 微信小程序--使用云开发完成支付闭环
微信小程序--使用云开发完成支付闭环 1.流程介绍 2. 代码实现和逻辑思想描述 云函数统一下单 对应云函数 unipay [CloudPay.unifiedOrder] 函数思路 : 调用云函数封装 ...
- Slog71_选取、上传和显示本地图片GET !(微信小程序之云开发-全栈时代3)
ArthurSlog SLog-71 Year·1 Guangzhou·China Sep 12th 2018 ArthurSlog Page GitHub NPM Package Page 掘金主页 ...
- 微信小程序之蓝牙开发(详细读数据、写数据、附源码)
本文将详细介绍微信小程序的蓝牙开发流程(附源码)准备:微信只支持低功耗蓝牙也就是蓝牙4.0,普通的蓝牙模块是用不了的,一定要注意. 蓝牙可以连TTL接到电脑上,再用XCOM调试 一开始定义的变量 va ...
- 5行代码实现微信小程序图片上传与腾讯免费5G存储空间的使用
本文介绍了如何在微信小程序开发中使用腾讯官方提供的云开发功能快速实现图片的上传与存储,以及介绍云开发的 5G 存储空间的基本使用方法,这将大大提高微信小程序的开发效率,同时也是微信小程序系列教程的视频 ...
- 微信小程序对接串口摄像头
串口摄像头由树莓派控制,代码如下: # _*_ coding:utf-8 import serial import time import traceback import pycurl import ...
- 微信小程序对接显示阿里云数据库数据
现实需求 在项目中需求,有时候现场设备发生故障,需要远程的人员知道.除了邮件方式,以微信小程序的方式也很好.今天进行尝试,并制作了一个demo版本. 1.微信小程序申请制作前端 1.1lists文件( ...
- 两行代码实现微信小程序联系人sidebar
话不多说,先给你们看看核心数据和结构: 一.数据: city的json array,letter的array (city的json array里的首字母是我手工放置进去的,你也可以通过for循环获得c ...
- 基于微信小程序的系统开发准备工作
腾讯推出微信小程序也有一段时间了,在各种行业里面也都掀起一阵阵的热潮,很多APP应用被简化为小程序的功能迅速推出,同时也根据小程序的特性推出各种独具匠心的应用,相对传统的APP来说,微信小程序确实能够 ...
随机推荐
- vulnhub-xxe靶场通关(xxe漏洞续)
vulnhub-xxe靶场通关(xxe漏洞续) 下面简单介绍一个关于xxe漏洞的一个靶场,靶场来源:https://www.vulnhub.com 这里面有很多的靶场. 靶场环境需要自己下载:http ...
- 性能_3 jmeter连接数据库jdbc(sql server举例)
一.下载第三方工具包驱动数据库 1. 因为JMeter本身没有提供链接数据库的功能,所以我们需要借助第三方的工具包来实现. (有这个jar包之后,jmeter可以发起jdbc请求,没有这个jar包, ...
- 通过ssh远程执行kubectl命令报错问题
在使用Jenkins链接Kubernetes集群,如果Jenkins安装机器与Kubernetes Master节点不在同一台机器上面,需要使用ssh远程执行部署命令,如下: ssh root@10. ...
- java后台导出表格文件
Java类所需jar包 import java.io.File; import java.io.IOException; import java.io.InputStream; import java ...
- 【Springboot】拦截器
Springboot 拦截器 1.什么是拦截器? 拦截器可以根据 URL 对请求进行拦截,主要应用于登陆校验.权限验证.乱码解决.性能监控和异常处理等功能. 2.定义拦截器步骤 在 Spring Bo ...
- 即构微信小程序直播组件是什么?有哪些功能?哪些小程序类目可以使用?
即构直播助手是微信官方认证的微信小程序插件,为开发者提供便捷.强大的微信小程序音视频直播服务. 即构直播助手除了包含微信小程序下的音视频推拉流能力,还支持iOS.Android.Windows.Web ...
- ABP 的ajax请求错误:400 Empty or invalid anti forgery header token.
ABP 的ajax请求错误 记录于2018-03-22 13:31:16 星期四 错误信息:400 Empty or invalid anti forgery header token. 我从网上找到 ...
- Element-ui源码解析(一):项目目录解析
开始看原码了,我们要开始一些准备工作, 既然是拆代码,那么我们要先把代码搞到手 1.如何下载原码 随便开个项目 npm i element-ui -S 将源码下载到本地 随后在node_module ...
- 我真的不想再用mybatis和其衍生框架了选择自研亦是一种解脱
我真的不想再用mybatis和其衍生框架了选择自研亦是一种解脱 文档地址 https://xuejm.gitee.io/easy-query-doc/ GITHUB地址 https://github. ...
- 看element源码学到的小技巧
中午无休的时候有点无聊, 看了一下昨天clone 的 element-ui 源码, 发现很多优雅之处, 记录一下让我直接用到项目中的一个点 那就是绝对定位的元素放到body 里面的 同级.这么做的好处 ...