作者:我木良心c | 来源:互联网 | 2023-09-09 17:33
以下代码基于uni-app编写如果没有appid,那么uni-login是受限制的https:open.weixin.qq.com认证商户()微信登入不同的应用对于微信登入会做不
以下代码基于uni-app编写 如果没有appid,那么uni-login是受限制的
https://open.weixin.qq.com/ 认证商户()
微信登入
不同的应用对于微信登入会做不同的处理,即微信服务器(微信官方的)返回发送的OpenId是不相同的(后面会解释OpenId是干嘛用的,它涉及到数据库)。因此也有
UnionID
UnionID 机制说明
如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过 UnionID 来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的 UnionID 是唯一的。换句话说,同一用户,对同一个微信开放平台下的不同应用,UnionID是相同的
本站后端服务后一部分(已经获取到OpenId,UnionID或者请求,暂时叫身份标识VID)
当客户端已经发送带有VID的东西是,可以存入数据库表(
表是user表个id, VID, name, avatarUrl等字段
)
,注意,获取到VID先查询是否存在,不存在则插入新增一条记录,否则检验name和VID是否匹配(其实可以只检查VID),检验成功则表示登入成功(这里可以使用正常的前后端登入逻辑,如token等),返回数据给客户端。
App端
AppSDK配置里的微信登入appid和appsecret需要填写,开发时暂时可以随便写,如果上线要申请微信的(微信开发者平台)
app端可以直接通过接口获取第三方接口:通过发送发送自带的login请求,再响应成功后,获取到VID,再次请求getUserInfo,响应成功获取用户微信已有信息,向本站服务器发起登入请求,携带VID(一般还有头像和名称)
export default {data() {return {};},onLoad:function(){uni.login({success: (res) => {uni.getUserInfo({success: (info) => {},fail: () => {uni.showToast({title:"微信登录授权失败"});}})},fail: () => {uni.showToast({title:"微信登录授权失败"});}})}
}
小程序端
进入小程序后台管理,点击开发 => 开发设置 可以看到id和serect,注意改变manifest.json配置即可,后端也是需要这些数据的,下面会讲到
<template><view><button type="primary" open-type="getUserInfo" @getuserinfo="getUserInfo">使用微信登录button>view>
template>
var _self, pageOptions, session_key, openid;
export default {data() {return {};},methods:{getUserInfo : (info) => {info = info.mp.detail.userInfo;uni.request({url: _self.apiServer+'member&m=login',method: 'POST',header: {'content-type' : "application/x-www-form-urlencoded"},data: {openid : openid,name : info.nickName,face : info.avatarUrl,},success: res => {console.log(res);res = res.data;if(res.status == 'ok'){uni.showToast({title:"登录成功"});uni.setStorageSync('SUID' , res.data.u_id + '');uni.setStorageSync('SRAND', res.data.u_random + '');uni.setStorageSync('SNAME', res.data.u_name + '');uni.setStorageSync('SFACE', res.data.u_face + '');if(pageOptions.backtype == 1){uni.redirectTo({url:pageOptions.backpage});}else{uni.switchTab({url:pageOptions.backpage});}}else{uni.showToast({title:res.data});}},fail: (e) => {console.log(JSON.stringify(e));}});},},onLoad:function(options){_self = this;pageOptions = options;uni.login({success: (res) => {uni.request({url:_self.apiServer+'member&m=codeToSession&code='+res.code,success: (sessions) => {session_key = sessions.data.session_key;openid = sessions.data.openid;},});}});}
}
客户端先调用uni.login获取,微信平台服务器返回的code、session_key,再向本站服务器访问提交code、session_key,后端拿到这些值进行向微信服务器接口请求带参数
$url = "https://api.weixin.qq.com/sns/jscode2session?appid=" + APP_ID + "&secret=" + APP_SERECT +"&js_code=" + ctx.request.body['code'] +"&grant_type=authorization_code";
$weixin = request($url)
ctx.body = {$weixin
}
后端返回OpenId后,当前端点击登入按钮,触发微信的getUserInfo事件(微信只能通过按钮实现),再用获取到的OpenId去完成后面的逻辑
UnionID
(主要是要给钱,注册企业账号)
暂时不想用它,就不搞了,但是其实差不多的:
可以在getUserInFo获取加密信息,将加密数据传给后端,后端通过对于的js解密(官方给出解密函数),解密就能获取
用户信息和VID了