发布网友 发布时间:2024-09-18 12:01
共1个回答
热心网友 时间:2024-09-28 02:26
title:利用微信小程序扫码授权date:2022-05-1311:09:09cover:https://static.nnnnzs.cn/bing/20220513.pngtags:
技术微信小程序扫码授权背景想要使用微信扫码登录自己的网址,通过授权快速获取用户的昵称,头像功能由于没有企业认证账号,故只能通过微信小程序实现,
体验地址https://api.nnnnzs.cn/screen-demo.html?env=release
源码https://github.com/NNNNzs/wechat-screen-tools
原理利用微信小程序的动态创建场景码接口(https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.getUnlimited.html),创建短token的信息存储在服务端,而不需要大量信息存储在二维码里,实现授权
流程客户端在请求图片,服务生成token,注册到认证服务
前端根据token,获取带场景值的二维码图片,并轮训该token状态
使用微信扫码,根据token获取应用信息并展示,在小程序授权登录,获取openid,nickname,avatorImg等信息
确认允许登录后,发送confirm请求,发送userInfo值
网络获取到该token对应的用户信息
流程图核心接口接口传参返回值说明getToken-token获取tokengetImgByTokentoken图片的arrayBuffer获取小程序码getInfoByTokentokenuserInfo获取用户信息statustoken-1|0|1-1表示为扫码,0表示已扫码未授权,1表示已经授权confirmnickName、openid,头像等-小程序的允许授权时确认的接口踩坑点scene长度为最大32字符,利用nodejs的uuid.v4生成的值超过32位解决方案
uuid.v4().replace(/-/g,"").toUpperCase();生成二维码时,如果没有指定page字段可能会在页面里获取不到场景值(scene)解决方案指定page:"pages/index/index"
getwxacodeunlimit接口成功直接返回buffer错误返回的是json,在axios中需要根据response的contentType来判断成功还是失败解决方案
router.get("/getImgByToken",async(req,res)=>{const{access_token,expires_in}=awaitwechat.getAccessToken();constua=req.headers["user-agent"];consttoken=req.query.token;constenv=req.query.env;//env区分release发行版本trial体验版develop开发版//https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.getUnlimited.htmlaxios({url:"https://api.weixin.qq.com/wxa/getwxacodeunlimit",method:"post",params:{access_token:access_token,},responseType:"arraybuffer",data:{scene:token,env_version:env||"trial",check_path:false,page:"pages/index/index",},}).then((response)=>{constisSuccess=response.headers["content-type"].includes("image");if(!isSuccess){console.log(response.data.toString("utf-8"));}else{res.type("png").send(response.data);}});});无论是wx.getUserProfile还是wx.getUserInfo无法静默获取userInfo,都需要授权弹窗登录,不过可以缓存信息解决方案扫码进入之后onLoad就弹窗,并且存储场景值,允许拒绝授权之后再次
开发的时候场景值每次提交代码生成预览版本比较麻烦解决方案在微信小程序开发工具里面添加条件编译,通过二维码编辑
原文:https://juejin.cn/post/7100066878797643789热心网友 时间:2024-09-28 02:19
title:利用微信小程序扫码授权date:2022-05-1311:09:09cover:https://static.nnnnzs.cn/bing/20220513.pngtags:
技术微信小程序扫码授权背景想要使用微信扫码登录自己的网址,通过授权快速获取用户的昵称,头像功能由于没有企业认证账号,故只能通过微信小程序实现,
体验地址https://api.nnnnzs.cn/screen-demo.html?env=release
源码https://github.com/NNNNzs/wechat-screen-tools
原理利用微信小程序的动态创建场景码接口(https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.getUnlimited.html),创建短token的信息存储在服务端,而不需要大量信息存储在二维码里,实现授权
流程客户端在请求图片,服务生成token,注册到认证服务
前端根据token,获取带场景值的二维码图片,并轮训该token状态
使用微信扫码,根据token获取应用信息并展示,在小程序授权登录,获取openid,nickname,avatorImg等信息
确认允许登录后,发送confirm请求,发送userInfo值
网络获取到该token对应的用户信息
流程图核心接口接口传参返回值说明getToken-token获取tokengetImgByTokentoken图片的arrayBuffer获取小程序码getInfoByTokentokenuserInfo获取用户信息statustoken-1|0|1-1表示为扫码,0表示已扫码未授权,1表示已经授权confirmnickName、openid,头像等-小程序的允许授权时确认的接口踩坑点scene长度为最大32字符,利用nodejs的uuid.v4生成的值超过32位解决方案
uuid.v4().replace(/-/g,"").toUpperCase();生成二维码时,如果没有指定page字段可能会在页面里获取不到场景值(scene)解决方案指定page:"pages/index/index"
getwxacodeunlimit接口成功直接返回buffer错误返回的是json,在axios中需要根据response的contentType来判断成功还是失败解决方案
router.get("/getImgByToken",async(req,res)=>{const{access_token,expires_in}=awaitwechat.getAccessToken();constua=req.headers["user-agent"];consttoken=req.query.token;constenv=req.query.env;//env区分release发行版本trial体验版develop开发版//https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.getUnlimited.htmlaxios({url:"https://api.weixin.qq.com/wxa/getwxacodeunlimit",method:"post",params:{access_token:access_token,},responseType:"arraybuffer",data:{scene:token,env_version:env||"trial",check_path:false,page:"pages/index/index",},}).then((response)=>{constisSuccess=response.headers["content-type"].includes("image");if(!isSuccess){console.log(response.data.toString("utf-8"));}else{res.type("png").send(response.data);}});});无论是wx.getUserProfile还是wx.getUserInfo无法静默获取userInfo,都需要授权弹窗登录,不过可以缓存信息解决方案扫码进入之后onLoad就弹窗,并且存储场景值,允许拒绝授权之后再次
开发的时候场景值每次提交代码生成预览版本比较麻烦解决方案在微信小程序开发工具里面添加条件编译,通过二维码编辑
原文:https://juejin.cn/post/7100066878797643789