taro 重新加载小程序_基于Taro框架的微信小程序JWT授权登录方案

原文：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