vuex下token 参数的全局调用：

目录

工作原理：

具体步骤

1、在登录路由添加自定义mate字段, 来记录该页面是否需要身份验证

2、设置路由拦截 router-index.js

3、设置拦截器

4、将token存储在本地中

---

工作原理：

        前端页面进行登录操作, 将用户名与密码发给服务器;

        服务器进行效验, 通过后生成token, 包含信息有密钥, uid, 过期时间, 一些随机算法等 ,然后返回给前端

        前端将token保存在本地中, 建议使用localstorage进行保存.  下次对服务器发送请求时, 带上本地存储的token

        服务器端,进行对token的验证, 通过的话, 进行相应的增删改查操作, 并将数据返回给前端

        为通过则返回错误码, 提示保错信息, 然后跳转到登录页。

具体步骤：

所用技术: vuex + axios + localStorage + vue-router

1、在登录路由添加自定义mate字段, 来记录该页面是否需要身份验证

//router.js

{

path: "/index",

name: "index",

component: resolve => require(['./index.vue'], resolve),

meta: {

requiresAuth: true

}

}

2、设置路由拦截 router-index.js

//全局守卫，前置守卫
router.beforeEach(async (to, from, next) => {
  //to：获取要跳转的路由信息
  //from：获取从哪个路由来的信息
  //next：放行函数next();
  //用户登陆了才会有token，未登陆不会有token
  let token = store.state.user.token;
  let name = store.state.user.userInfo.name;
  if (token) {
    //禁止去login页面
    i