1.前言
开发中我们常常遇到,微信,QQ等第三方登录在App上进行授权登录,便于用户快速登录,今天将详细讲解app实现微信授权的登录流程,话不多说~~
2.真机调试与打包
1. 手机配置
手机打开开发者模式,基本就是打开手机设置
—> 关于手机
—>软件版本或版本号
—>点击5到6次
直到出现如下图即可:
同时手机需要开启USB调试,找到系统更新
—>开发人员选项
—>开启USB调试
数据线连接电脑和手机,在弹出页面中选择文件传输
2. 打包
一切准备就绪打开HBuilder X运行项目:
这里就不在开发调试了,为了避免每一次调试都进行打包,会造成时间与资源的浪费,我们直接打包自定义基座
详细见官方文档
3. 生成签名
打开下载的软件
3.微信授权
1. 授权基础配置
声明:实现微信授权需要 app应用包名 , app应用签名 和 appid
完成上图的后台配置。
打开HBuilder X,打开manifest.json
进行配置
2. 代码实现
这里使用H5+plus
实现App的微信授权
export const wxloginHook = () => {
return new Promise((resolve, reject) => {
plus.oauth.getServices((services) => {
if (services && services.length) {
services.forEach((item) => {
if (item.id === "weixin") {
item.authorize((event) => {
// event.code传递给后台获取token,请求用户信息
resolve(event)
}, (fail) => {
reject(fail)
Toast('none', '取消授权')
}, {
scope: "snsapi_userinfo",
state: "authorize",
// 后台配置的appid
appid: "",
});
} else {
Toast('none', '当前环境不支持微信授权')
}
})
}
}, (fail) => {
Toast('none', '无微信授权服务')
reject(fail)
})
})
}
详细见官方文档
最后运行代码弹出授权页面点击同意授权获取code
4.写在最后
APP端的微信登录使用的是h5+的api,个人也是查阅相关文档,实现了微信授权登录,没涉及技术难点,仅供刚刚接触到授权业务的翻阅,如有不对欢迎指出
原文链接:https://juejin.cn/post/7344173123388522533 作者:the局外人