原文:https://www.jianshu.com/p/c2e712609c7b
背景
小程序这两年可谓是风风火火,已经涉及到了行业的方方面面,作为一枚前端码农,为了紧跟时代的步伐,满足市场的需要,楼主也步入了小程序的坑中,一探究竟,从最初的原生开发,过渡到WePY的引入,又转到了mpvue的框架,最近又准备踩踩Taro的坑 了~
之所以从
mpvue
框架迁移到
Taro
框架,一是由于该框架是京东凹凸实验室开发维护的,目前来看比较活跃,更新迭代速度比较快,质量上有一定的保障;二是该框架支持多端统一,一劳永逸,为后面拓展H5等其他业务奠定基础~
因业务需求,我们采用
JWT
进行身份鉴权,所以才有了这篇
JWT
授权登录 解(cai)决(keng)方(zhi)案(nan),如果对
JWT
还不是很了解的小伙伴,请猛戳这里~
ok,不废话了,直接进入你们最想看到代码环节~
正文
关于
Taro
的安装的使用,我这里就不再赘述了,具体的步骤可以参考官网给出的教程,我们直接来看看授权登录这一块~
FBI WARNING
: 本文相关的代码是跟楼主目前公司的有些业务场景有关,如有不同,请自行更改即可~
初始化
Taro
项目时,我们需要选择使用
Redux
模版,进行状态管理,然后默默等待依赖安装完成,通过
npm run dev:weapp
命令就可以启动我们的小程序服务了~
接下来跟着我的步骤走下去~
step1
首先,我们需要使用到
Redux
定义一些
app
相关的数据,方便我们后面的判断和使用~
Redux
三步走,
reducer
、
constant
、
action
我这里就直接贴代码了~
*
constants
目录
//constants app.js//更改app登录状态export const CHANGE_APP_ON_LAUNCH = 'change_app_on_launch';//写入授权信息export const INSERT_AUTHORIZE = 'insert_authorize';
*
actions
目录
// actions app.jsimport * as constants from '../constants/app'//更改登录状态export const changeAppOnLaunch = () => ({ type : constants.CHANGE_APP_ON_LA