简单了解小程序+node梳理登陆流程


Posted in Javascript onJune 24, 2019

希望通过小程序+node来整体的了解下小程序登陆的流程。如有不对欢迎在评论区指出

1. client: wx.login()

wx.login({
success: ([code]) => {
// 发送 code 到后台换取 openId, sessionKey, unionId
}
})

2. service: request()

服务端请求,需要的参数(js_code:client传的code;appid:小程序唯一标识申请账号时拿到;secret:小程序密钥申请账号时拿到;grant_type:默认值为 authorization_code)

// 请求方法
const request = require('request')
const url = https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
module.exports = {
async getSession(code) {
return new Promise((resolve, reject) => {
request(url,{
method: 'GET',
json: true
},
(error, res, body) => {
if (error) {
reject(error)
} else {
if (body.errcode) {
reject(new Error(body.errmsg))
} else {
resolve(body)
}
}
}
)
})
}
}

3.service:加密解密处理

const crypto = require('crypto')
const secret = '2019_06'
const algorithm = 'aes-256-cbc'
function encode(id) {
const encoder = crypto.createCipher(algorithm, secret)
const str = [id, Date.now(), '2019'].join('|')
let encrypted = encoder.update(str, 'utf8', 'hex')
encrypted += encoder.final('hex')
return encrypted
}
function decode(str) {
const decoder = crypto.createDecipher(algorithm, secret)
let decoded = decoder.update(str, 'hex', 'utf8')
decoded += decoder.final('utf8')
const arr = decoded.split('|')
return {
id: arr[0],
timespan: parseInt(arr[1])
}
}
module.exports = {
encode,
decode
}

4.service:返回登陆态

const { encode } = require('./lib/crypto')
const jsonMine = 'application/json'
const now = Date.now()
function handle(ctx, data, code = 0, message = 'success') {
ctx.type = jsonMine
ctx.body = {
code,
data,
message
}
}
router.get('/login', async (ctx, next) => {
const { code } = ctx.request.query
const session = await login(code)
if (session) {
const { session_key, openid } = session
// 查找数据库中是否已经存有openid,如果 hasOpenid 为null说明是新用户
const hasOpenid = await User.findByPk(openid)
if(!hasOpenid){
// 数据库存储openid,时间戳
User.create({openid,timespan:Date.now()})
}
handle(ctx, { token: encode(openid) })
} else {
throw new Error('登陆失败')
}
})

5.client:存储登陆态在storage

import { LOGIN_TOKEN } from '../../utils/localStorage'
// 拿到token存储到客户端
wx.setStorageSync(LOGIN_TOKEN, token)

我在发起请求时将登陆态放在请求头中,相应的服务端可以从请求头中获取

header: {
'x-session': wx.getStorageSync(LOGIN_TOKEN)
},

6.service:校验登陆态

module.exports = async function(ctx, next) {
const sessionKey = ctx.get('x-session')
const { id, timespan } = decode(sessionKey)
// 查找数据库中是否存在该 openid,返回是一个数组,如果不存在则返回[]
const targetList = await getOpenid(id)
if (targetList.length > 0) {
// 如果超过设定的过期时间,标记isExpired字段为登陆过期
const oneHour = 1000 * 60 * 60 * 24
if (Date.now() - timespan > oneHour) {
ctx.state.isExpired = true
// 跟前台约定,如果code=2说明登陆过期跳登陆页面
handle(ctx, '', 2, '登陆过期')
} else {
handle(ctx, '', 0, '登陆成功')
}
} else {
// 通过ctx.throw可以直接抛出错误
ctx.throw(401, '登陆失败')
}

整体流程图

简单了解小程序+node梳理登陆流程

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,

Javascript 相关文章推荐
基于JQuery的6个Tab选项卡插件
Sep 03 Javascript
很不错的两款Bootstrap Icon图标选择组件
Jan 28 Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
May 17 Javascript
iscroll-probe实现下拉刷新和下拉加载效果
Jun 28 Javascript
weex里Vuex state使用storage持久化详解
Sep 09 Javascript
简单实现jquery隔行变色
Nov 09 jQuery
vue better scroll 无法滚动的解决方法
Jun 07 Javascript
微信小程序制作表格的方法
Feb 14 Javascript
Vue3.x源码调试的实现方法
Oct 13 Javascript
JavaScript实现图片轮播特效
Oct 23 Javascript
解决Angularjs异步操作后台请求用$q.all排列先后顺序问题
Nov 29 Javascript
javascript中innerHTML 获取或替换html内容的实现代码
Mar 17 Javascript
JS数组扁平化(flat)方法总结详解
Jun 24 #Javascript
深入了解query和params的使用区别
Jun 24 #Javascript
如何使用JavaScript实现栈与队列
Jun 24 #Javascript
简单了解JavaScript中的执行上下文和堆栈
Jun 24 #Javascript
一次让你了解全部JavaScript的作用域
Jun 24 #Javascript
通过循环优化 JavaScript 程序
Jun 24 #Javascript
在React中写一个Animation组件为组件进入和离开加上动画/过度效果
Jun 24 #Javascript
You might like
PHP 之Section与Cookie使用总结
2012/09/14 PHP
基于xcache的配置与使用详解
2013/06/18 PHP
php遍历目录下文件并按修改时间排序操作示例
2019/07/12 PHP
修改jQuery Validation里默认的验证方法
2012/02/14 Javascript
jQuery中使用data()方法读取HTML5自定义属性data-*实例
2014/04/11 Javascript
JS使用ajax从xml文件动态获取数据显示的方法
2015/03/24 Javascript
js实现对ajax请求面向对象的封装
2016/01/08 Javascript
jQuery实现下拉框左右移动(全部移动,已选移动)
2016/04/15 Javascript
基于JS代码实现实时显示系统时间
2016/06/16 Javascript
jQuery通过改变input的type属性实现密码显示隐藏切换功能
2017/02/08 Javascript
原生js二级联动效果
2017/06/20 Javascript
angular4 JavaScript内存溢出问题
2018/03/06 Javascript
TypeScript中使用getElementXXX()的示例代码
2019/09/12 Javascript
vue 中固定导航栏的实例代码
2019/11/01 Javascript
pygame学习笔记(1):矩形、圆型画图实例
2015/04/15 Python
在Mac OS上搭建Python的开发环境
2015/12/24 Python
Python算法应用实战之队列详解
2017/02/04 Python
利用Python爬虫给孩子起个好名字
2017/02/14 Python
Python实现列表删除重复元素的三种常用方法分析
2017/11/24 Python
Python实现的凯撒密码算法示例
2018/04/12 Python
Python发送邮件测试报告操作实例详解
2018/12/08 Python
Python绘制堆叠柱状图的实例
2019/07/09 Python
详解Python time库的使用
2019/10/10 Python
python线程定时器Timer实现原理解析
2019/11/30 Python
解决pycharm上的jupyter notebook端口被占用问题
2019/12/17 Python
python ETL工具 pyetl
2020/06/07 Python
详解python的xlwings库读写excel操作总结
2021/02/26 Python
Bugatchi官方网站:男士服装在线
2019/04/10 全球购物
美国校服网上商店:French Toast
2019/10/08 全球购物
土木工程毕业生自荐信
2013/11/12 职场文书
大学班长的职责
2014/01/27 职场文书
医生爱岗敬业演讲稿
2014/08/26 职场文书
打架检讨书范文
2015/01/27 职场文书
文化苦旅读书笔记
2015/06/29 职场文书
读《瓦尔登湖》有感:每个人都需要一个瓦尔登湖
2019/10/17 职场文书