1.前端:通过 uni.getUserProfile 和 uni.login 来实现
1.主要流程:先通过 uni.getUserProfile授权获取用户名称和头像等信息 在调用 uni.login 获取微信登录需要的临时code
2. 前端代码:
async onLogin() {
const [, userProfile] = await uni.getUserProfile({
desc: "获取用户信息",
lang: "zh_CN",
});
if (userProfile) {
const [, loginInfo] = await uni.login({ provider: "weixin" });
if (loginInfo) {
const { code } = loginInfo;
const {userInfo: { avatarUrl, nickName }} = userProfile;
const params = {code, avatarUrl, userName: nickName};
const { data } = await wxLogin(params);
uni.setStorageSync(USER_TOKEN, data.token);
this.$store.commit("SET_USER_INFO", data);
this.$api.msg("登陆成功");
}
}
},
2.后端:需要通过调用微信提供的第三方接口来实现
1.主要流程:在前端调用接口成功的将临时code 传递给后端时 ,后端通过调用微信的第三方接口拿到 openid, session_key 这两个参数,查询数据库是否有 openid 如果有则更新 session_key ,如果没有则在数据库中新建一条用户信息的数据
2.后端代码(node.js)
router.post('/wxLogin', async (req, res, next) => {
try {
const { code, avatarUrl, userName } = req.body
let token = Token.tokenSet()
const appId = 'wx66dee29d470c6095'
const appSecret = '79ee1240fa1ee8f67066d67fa7692e21';
const url = `https://api.weixin.qq.com/sns/jscode2session?appid=${appId}&secret=${appSecret}&js_code=${code}&grant_type=authorization_code`
const { data: { openid, session_key } } = await axios({ url, method: 'get' })
const updateInfo = await db.findOneAndUpdate({ openId: openid }, { $set: { sessionKey: session_key, token,avatarUrl,userName } })
if (updateInfo) {
const userInfo = await db.findOne({openId: openid})
return res.jsonp({ code: 1, message: '登录成功', data: userInfo})
} else {
const insertInfo = { openId: openid, sessionKey: session_key, userType: 2, status: 1, token, userName,avatarUrl }
const userInfo = await db.findOne({openId: openid})
await db.insertMany(insertInfo)
return res.jsonp({ code: 1, message: '登录成功', data: userInfo})
}
} catch {
next({ message: '接口错误' })
}
})
完整的代码逻辑可参考