uniapp unicloud之个人微信小程序云开发，微信授权登录，token验证

2024-05-31 18:07| 来源: 网络整理| 查看: 265

unicloud微信小程序云开发

最近自己因为每天吃什么烦恼，动手做了一个随机吃什么的微信小程序。小程序使用uniapp开发配合unicloud一个人独立完成前后端开发。小程序二维码

开发工具微信开发者工具 hbuilder X 1.创建项目

使用hbuilder创建一个云开发项目新建uniapp云开发项目勾选启用uniCloud，这里我选择的是阿里云。创建完成后打开项目目录，找到uniCloud右键关联云服务空间，根据提示创建并绑定。参考https://uniapp.dcloud.io/uniCloud/concepts/space

2.配置

创建完成后在项目目录的manifest.json，配置小程序后台获取的微信小程序appID。配置微信小程序appID

3.UI组件引入

我这里使用了 uview UI组件，根据教程安装即可（不使用可不引入）

4.公共请求方法

为了方便后续请求云函数，新建了一个common目录，封装了一个cloudApi公共方法。

在main.js中引入引入公共方法

5.微信授权登录

获取code传给后台

wxLogin() { let _this = this; let code; uni.login({ provider: 'weixin', success: res => { code = res.code;//获取登录需要的code } }); uni.getUserProfile({ desc: '用户信息，拿来吧你！', lang: 'zh_CN', success: res => { uni.showLoading(); let data = res.userInfo;//授权拿到用户信息 data.code = code; // 调用登录云函数 _this.$cloudApi.call({ name: 'login', data, success: res => { uni.setStorageSync('userInfo', data);//拿到后台返回的用户信息 uni.reLaunch({ url:'/pages/index/index' }) } }); } }); }

云函数接收code和appId，appSecret一起使用，换取openid。添加用户到user表。

'use strict'; const { appId, appSecret, getToken, verifyToken } = require("wx-common"); const db = uniCloud.database(); exports.main = async (event, context) => { //获取前端参数 const { code, nickName, gender, city, province, country, avatarUrl } = event; //获取openid const res = await uniCloud.httpclient.request( `https://api.weixin.qq.com/sns/jscode2session?appid=${appId}&secret=${appSecret}&js_code=${code}&grant_type=authorization_code`, { dataType: "json" } ) let openid = res.data.openid; //获取user表 const collection = db.collection('user'); // 生成token let token = getToken(openid) // 新增并返回用户信息 let userData = { nickName, gender, city, province, country, avatarUrl, openid } // 往user表添加用户信息 const resData = await db.collection("user").add(userData) //将用户信息返回前端 letdata = { nickName, gender, city, province, country, avatarUrl } return { code: 200, msg: '登录成功', data: { userInfo: data, token: token } } };

这里token的生成是使用的jsonwebtoken，我是在云函数common目录下放了一个wx-common目录。公共目录

在wx-common目录下使用

npm install jsonwebtoken

安装jsonwebtokne后直接引入使用即可，，并写了一个公共js生成解析token。

const jwt = require("jsonwebtoken"); //webjsontoken //生成token function getToken(openid) { // sign(加密数据，加密辅助，过期时间(单位/s)) return jwt.sign({ openid }, appSecret, { expiresIn: 60 * 60 * 24 * 30 }); } //解密token function verifyToken(token) { return jwt.verify(token, appSecret, (err, decode) => { return decode }) } module.exports = { getToken, verifyToken }

这也是我第一次个人云开发微信小程序，有问题可以一起探讨交流，欢迎各位大佬指正，谢谢！下面是我的小程序二维码，欢迎查看。

【本文地址】

公司简介

联系我们