简单了解小程序+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 相关文章推荐
js 使用form表单select类实现级联菜单效果
Dec 19 Javascript
JS获取文本框,下拉框,单选框的值的简单实例
Feb 26 Javascript
jQuery实现带有上下控制按钮的简单多行滚屏效果代码
Sep 04 Javascript
谈谈我对JavaScript中typeof和instanceof的深入理解
Dec 25 Javascript
Bootstrap Search Suggest使用例子
Dec 21 Javascript
javascript 网页进度条简单实例
Feb 22 Javascript
Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法
Aug 08 Javascript
vuejs前后端数据交互之从后端请求数据的实例
Aug 11 Javascript
Mint-UI时间组件起始时间问题及时间插件使用
Aug 20 Javascript
详解vue项目接入微信JSSDK的坑
Dec 14 Javascript
vue实现标签云效果的方法详解
Aug 28 Javascript
在vue中使用vant TreeSelect分类选择组件操作
Nov 02 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
动态网站web开发 PHP、ASP还是ASP.NET
2006/10/09 PHP
PHP 单引号与双引号的区别
2009/11/24 PHP
解析php中call_user_func_array的作用
2013/06/07 PHP
探讨fckeditor在Php中的配置详解
2013/06/08 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
JavaScript 存在陷阱 删除某一区域所有节点
2010/05/10 Javascript
JavaScript中将一个值转换为字符串的方法分析[译]
2012/09/21 Javascript
js简单的表格添加行和删除行操作示例
2014/03/31 Javascript
jquery通过visible来判断标签是否显示或隐藏
2014/05/08 Javascript
jQuery通过点击行来删除HTML表格行的实现示例
2014/09/10 Javascript
简介JavaScript中Math.cos()余弦方法的使用
2015/06/15 Javascript
js实现模拟银行卡账号输入显示效果
2015/11/18 Javascript
JavaScript获取客户端IP的方法(新方法)
2016/03/11 Javascript
jQuery unbind 删除绑定事件详解
2016/05/24 Javascript
JS图片左右无缝隙滚动的实现(兼容IE,Firefox 遵循W3C标准)
2016/09/23 Javascript
概述VUE2.0不可忽视的很多变化
2016/09/25 Javascript
微信小程序实现换肤功能
2018/03/14 Javascript
微信公众平台 客服接口发消息的实现代码(Java接口开发)
2019/04/17 Javascript
jQuery实现开关灯效果
2020/08/02 jQuery
js实现点击上传图片并设为模糊背景
2020/08/02 Javascript
Python通过select实现异步IO的方法
2015/06/04 Python
在Django的模型和公用函数中使用惰性翻译对象
2015/07/27 Python
Python手机号码归属地查询代码
2016/05/04 Python
python实现Decorator模式实例代码
2018/02/09 Python
Django rest framework工具包简单用法示例
2018/07/20 Python
pygame游戏之旅 按钮上添加文字的方法
2018/11/21 Python
python内存动态分配过程详解
2019/07/15 Python
世界上第一个创建了罩杯系统的美国内衣品牌:Maidenform
2019/03/23 全球购物
李培根演讲稿
2014/05/22 职场文书
刑事辩护授权委托书
2014/09/13 职场文书
局机关干部群众路线个人对照检查材料思想汇报
2014/10/05 职场文书
四风对照检查剖析材料
2014/10/07 职场文书
2014年党风廉政建设工作总结
2014/11/19 职场文书
初三化学教学反思
2016/02/22 职场文书
基于Go Int转string几种方式性能测试
2021/04/28 Golang
MySQL优化之慢日志查询
2022/06/10 MySQL