vuex-token的持久化

vuex中处理token

state中定义一个token
actions请求获得token值，但是actions不能直接修改state中token的值，通过模块化调用，使用mutation中的函数来改变token的值
mutation定义改变token和删除token的两个函数

持久化存储token的值

可以在本地存储一份

在对token初始化的时候，可以从本地获取一下，优先使用本地的token
setToken的时候，在本地也存一下
removeToken的时候，本地也删除token

import { getToken, setToken, removeToken } from '@/utils/auth'
export default {namespaced: true,state: {token: getToken() || null},mutations: {// 设置tokensetToken(state, token) {state.token = tokensetToken(token)},// 删除缓存removeToken(state) {state.token = nullremoveToken()}}
}

另一个js中写入本地存储token值

import Cookies from 'js-cookie'
const TokenKey = 'hrsaas-ihrm-token' // 设定一个独一无二的key
export function getToken() {return Cookies.get(TokenKey)
}export function setToken(token) {return Cookies.set(TokenKey, token)
}export function removeToken() {return Cookies.remove(TokenKey)
}

vuex-token的持久化相关推荐

js 操作vuex数据_Vuex 数据状态持久化如何处理？
点击右上方红色按钮关注"web秀",让你真正秀起来前言在前面文章中,我们详细的讲述了Vuex相关的知识,没有了解的小伙伴可以先去了解一波: <Vuex是什么?Vuex能做 ...
Vuex - 持久化
目录一.Vuex为什么要持久化? 二.vuex持久化实现步骤 1. 安装 2. 配置仓库store 三.存储不同模块数据 1. 获取指定模块state数据 2. 获取全局state和模块数据 3. ...
vscode使用vuex数据持久化插件(vuex-persistedstate)
vscode使用vuex数据持久化插件(vuex-persistedstate) 因为Vue是单页面应用,页面跳转是vue-router实现的类似页面跳转的效果(切换对应的组件以展示不同的页面),刷新 ...
token放在那里 url_token在项目生成和使用
目录用户登陆,发送手机号码和验证码后台接收参数,查找用户,用户存在就生成token,返回给前端前端登陆成功,把token存到vuex(做持久化) 使用axios拦截器,读取vuex中的token ...
基于.Net Framework 4.0 Web API开发（4）：ASP.NET Web APIs 基于令牌TOKEN验证的实现
概述: ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是在使用API的时候总会遇到跨域请求的问题, ...
使用identity+jwt保护你的webapi（三）——refresh token
前言上一篇已经介绍了identity的注册,登录,获取jwt token,本篇来完成refresh token. 开始开始之前先说明一下为什么需要refresh token. 虽然jwt toke ...
关于 IdentityServer4 中的 Jwt Token 与 Reference Token
原文:关于 IdentityServer4 中的 Jwt Token 与 Reference Token OpenID Connect(Core),OAuth 2.0(RFC 6749),JSON W ...
mpvue + vuex搭建小程序详细教程
源码 mpvue-vuex-demo 构成 1.采用mpvue 官方脚手架搭建项目底层结构 2.采用Fly.js 作为http请求库 3.引入mpvue-router-patach,以便在mpvue小 ...
实战讲解Spring Oauth2.0密码模式和授权码模式（内存inMemory+持久化jdbc配置）
1 缘起先吐槽, 在搜索关于Oauth2.0授权码方式认证时, 遇到的问题比较多,一句话,按照其分享的步骤一步一步来,最终,无法成功, 本想,抄近路,看一些前人分享的应用案例,直接使用, 近路不通, ...
【vuex是什么？有什么用？】
Vuex是一个专门为vue.js应用程序开发的状态管理工具状态在这里就是数据的意思使用场景:(1)登录信息.(2)购物车.(3)复杂的组件通信 vuex五大核心 1 state 状态的意思 ,是存 ...

vuex-token的持久化

vuex中处理token

持久化存储token的值

vuex-token的持久化相关推荐

最新文章

热门文章