【微信小程序+node】微信小程序结合node用户登录-06
2024-04-30 09:38:07
申请一个微信小程序账号，并获取appId，appSecret
1.使用新的qq注册一个新的小程序
2.获取appId，appSecret。特别注意appSecret需要自己保存，每次获取都要验证，特别麻烦。IP白名单可选开启，如果开启就把自己的服务器ip填入进去，否者获取不到请求的数据
1.微信小程序登录获取code
wxml
<button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 去授权 </button>
<button wx:else open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 去授权 </button>
utils.js
// 获取登录时的token
const getCodeLogin = function(successFn)
{wx.login({success(res){successFn(res);}})
}
js
import Util from '../../utils/util.js';
import {baseInfo} from "../../utils/config";
import {setRoleId, setSessionKey, setToken, setUserId, setUserInfo} from "../../utils/storage";let app = getApp();
//在组件实例进入页面节点树时执行
attached() {//判断微信是否可以使用wx.getUserProfileif (wx.getUserProfile) {this.setData({canIUseGetUserProfile: true})}},methods: {getUserProfile(e) {wx.showLoading()wx.getUserProfile({desc: '用于完善会员资料',success: (userInfoData) => {Util.getCodeLogin((res)=>{this.getWxUserInfo(userInfoData,res);})}})},getUserInfo(e) {this.setData({userInfo: e.detail.userInfo,hasUserInfo: true})},close(){let pages = getCurrentPages();let currPage = pages[pages.length - 1];if(this.data.isGoIndex){wx.switchTab({url:'/pages/index/index'});}else{this.setData({isHidden: true});if (currPage && currPage.data.isHidden != undefined){currPage.setData({ isHidden:true});}}},//这里获取到code同时发送到后端请求getWxUserInfo(userInfoData,res){let that = this;let code = res.code;let nickName = userInfoData.userInfo.nickName;let avatarUrl = userInfoData.userInfo.avatarUrl;//发起网络请求wx.request({url: "你的网址"+'/login',data: {code,avatarUrl,nickName},method: 'get',success: async res => {let {code,message,data} = res.data;if(code!=200){// console.log('登录失败！' + message);wx.showToast({title: `${message}`,icon: 'error',duration: 2000})return;}const token = data.token;const session_key = data.session_key;const user_id = data.user_id;const role_id = data.role_id;//将token存到全局app.globalData.token = token;app.globalData.session_key = session_key;app.globalData.user_id = user_id;app.globalData.role_id = role_id;setToken(token);setUserInfo({nickName,avatarUrl});setSessionKey(session_key);setUserId(user_id);setRoleId(role_id);//取消登录提示wx.hideLoading();//关闭登录弹出窗口that.setData({ isHidden: true, errorSum: 0 });that.triggerEvent('onLoadFun',{nickName,avatarUrl,token});}})}},
2.通过code获取用户唯一的openid
详细node后端逻辑，请查看另外一篇文章
https://blog.csdn.net/qq_36977923/article/details/122826720?spm=1001.2014.3001.5501
进入项目的控制层
user.js用户控制层
// 用户登录
login = async (req,res,next)=>{//req.body获取post请求的数据let {code,avatarUrl,nickName} = req.query;if(code && avatarUrl && nickName){//把code传到服务层进行处理，返回url进行请求(new userService()).xcxLoginGetToken(code).then(async resultUrl=>{if(resultUrl){//获取url请求回来的数据request(resultUrl, async (err, response, body) => {if(err) console.log(err);const data = JSON.parse(body);storage.setSessionKey(data.session_key)//添加用户信息进入数据库中return (new userService()).addUser(avatarUrl,nickName,data.openid).then(async userResult=>{//返回用户idlet {id,role_id} = userResult;if(userResult){new jwt({id: String(userResult)})let token = jwt.getToken();storage.setToken(token)await res.send(responseJson.successJson({session_key:data.session_key,token,user_id:id,role_id}));}else{await res.send(responseJson.errorJson(apiError.LOGIN_FAIL));}})})}else{await res.send(responseJson.errorJson(apiError.LOGIN_FAIL));}});}else{res.send(responseJson.errorJson(apiError.PARAMS_MISSION))}
}
userService.js用户服务层
const utils = require("../../../utils/utils")const User = require('../../../model/home/user/index')class userService{static appId = "xxx";static appSecret = "xxx";//通过code获取用户openid和unionid和session_keystatic code2Session = "https://api.weixin.qq.com/sns/jscode2session?";//通过code获取用户openid和unionid和session_keystatic getAccessToken = "https://api.weixin.qq.com/cgi-bin/token";//获取accesstokenasync xcxLoginGetToken(code){try{let appid = userService.appId;let secret = userService.appSecret;let code2Session = userService.code2Session;let js_code = code;let params ={appid,secret,js_code,grant_type:"authorization_code",}let urlData = utils.encodeSearchParams(params);let url = `${code2Session}${urlData}`return url;}catch (e) {console.log(e);return e;}}
}
utils.js
/*** url拼接对象为请求字符串* @param {Object} obj - 待拼接的对象* @returns {string} - 拼接成的请求字符串*/
encodeSearchParams=(obj)=>{const params = []Object.keys(obj).forEach((key) => {let value = obj[key]// 如果值为undefined我们将其置空if (typeof value === 'undefined') {value = ''}// 对于需要编码的文本（比如说中文）我们要进行编码params.push([key, encodeURIComponent(value)].join('='))})return params.join('&')
}✨踩坑不易，还希望各位大佬支持一下\textcolor{gray}{踩坑不易，还希望各位大佬支持一下}踩坑不易，还希望各位大佬支持一下
【微信小程序+node】微信小程序结合node用户登录-06相关推荐
- 微信小程序-云开发下的用户注册及用户登录逻辑
文章目录 一.前言 二.思路分析 三.这样做的好处 1.安全性 2.便捷性 3.健壮性 四.实现代码 1.创建集合.配置权限 2.实现代码(app.js) 五.一些疑惑 六.结语 一.前言 基于微信小 ...
- Day212.OAuth2、微信二维码登入注册功能、用户登录信息前后端供、讲师列表前后端 -谷粒学院
谷粒学院 OAuth2的使用场景 一.OAuth2解决什么问题 1.OAuth2提出的背景 照片拥有者想要在云冲印服务上打印照片,云冲印服务需要访问云存储服务上的资源 2.图例 资源拥有者:照片拥有者 ...
- 编写Java程序，使用Swing事件处理机制实现用户登录和英雄信息显示
返回本章节 返回作业目录 需求说明: 使用Swing事件处理机制实现用户登录和英雄信息显示 实现思路: 创建LoginView类,该类用于显示登录界面,为登录按钮添加ActionListener事件, ...
- 【Node.js+koa--后端管理系统】用户登录接口设计 | 登录验证 | 登录返回凭证（令牌）
- webform窗体怎么实现session唯一标识_微信小程序用户登录和登录态维护的实现_javascript技巧...
这篇文章主要介绍了微信小程序用户登录和登录态维护的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧 让用户登录,标识用户和获取 ...
- 【微信小程序】微信小程序入门与实战-个人笔记
微信小程序入门与实战 文章目录 微信小程序入门与实战 1 初识微信小程序 1-1 2020版重录说明 1-2 下载小程序开发工具 1-3 新建小程序项目 1-4 小程序appid的注册 1-5 新版小 ...
- 远程桌面中指定在用户登录时启动的程序
使用组策略(最佳操作) 打开"组策略". 在"计算机配置"."管理模板"."Windows 组件"."终端服务 ...
- node.js+小程序基于微信小程序的校园失物招领系统毕业设计源码072343
微信小程序的校园失物招领系统 摘 要 随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱,微信小程序的校 ...
- node.js毕业设计微信签到小程序（源码+程序+LW+部署）
该项目含有源码.文档.程序.数据库.配套开发软件.软件安装教程.欢迎交流 项目运行 环境配置: Node.js+ Vscode + Mysql5.7 + HBuilderX+Navicat11+Vue ...
最新文章
- Android AutoWrapTextView 解决中英文排版问题
- ping: sendto: Network is unreachable
- 转：Java异常分类以及相应处理机制
- 微型计算机系统包括( )几部分,微型计算机系统包括哪几个部分？
- 深度学习目标检测之 YOLO v2
- 程序员修复bug的吐血过程，太形象了
- Java开发学习教程之对象的创建与使用
- android通过xmpp实现服务器到客户端的推送功能
- python2安装pip2（python3安装pip）
- matlab负反馈传函,已知负反馈系统开环传函求阶跃传函
- pk 打包文件_【旅行】同样是旅行，为啥中国人喜欢拉行李箱，老外喜欢背大包？附干货：行李打包锦囊...
- 10. Linux驱动 - Ubuntu驱动签名
- unity IK初步应用 让游戏物体眼镜对准摄像头
- JQuery关于使用jsp:include标签需要注意的事
- 用python证明采样定理_如何理解 Nyquist 采样定理？
- 2020最新智能客服|聊天机器人算法、架构及应用分享
- java是什么？java能用来干嘛？
- 原神私服搭建二： 搭建服务端
- 计算机信息安全-病毒,信息安全-计算机病毒.doc
- AT32_IDE_Linux用户手册（附IDE下载地址）
热门文章