Redux实现Token持久化

业务背景: Token数据具有一定的时效时间,通常在几个小时,有效时间内无需重新获取,而基于Redux的存储方式又是基于内存的,刷新就会丢失,为了保持持久化,我们需要单独做处理

解决方案:

使用redux+LocalStorage解决,当浏览器被刷新,可以先查看localStorage中是否存储token,如果没有再进行初始化

 1.封装存取方法

// 封装存取方法

const TOKENKEY = 'token_key'

function setToken (token) {
  return localStorage.setItem(TOKENKEY, token)
}

function getToken () {
  return localStorage.getItem(TOKENKEY)
}

function clearToken () {
  return localStorage.removeItem(TOKENKEY)
}

export {
  setToken,
  getToken,
  clearToken
}

2、实现持久化逻辑

import { getToken, setToken } from '@/utils'
const userStore = createSlice({
  name: 'user',
  // 数据
  initialState: {
    token: getToken() || ''
  },
  // 同步修改方法
  reducers: {
    setUserInfo (state, action) {
      state.token = action.payload
      // 存入本地
      setToken(state.token)
    }
  }
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/759267.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

HTML图片链接缓存问题解决

关于解决HTML使用图片链接出现的缓存问题处理 1、项目上明明替换了图片却没发现更新,得去浏览器设置清除浏览器缓存或者其它一些操作才能解决,这也太麻烦了!加载过一次不会再加载第二次,其实这时候就存在浏览器图片缓存情况&…

1-5题查询 - 高频 SQL 50 题基础版

目录 1. 相关知识点2. 例题2.1.可回收且低脂的产品2.2.寻找用户推荐人2.3.大的国家2.4. 文章浏览 I2.5. 无效的推文 1. 相关知识点 sql判断,不包含null,判断不出来distinct是通过查询的结果来去除重复记录ASC升序计算字符长度 CHAR_LENGTH() 或 LENGTH(…

cpu,缓存,辅存,主存之间的关系及特点

关系图 示意图: ------------------- | CPU | | ------------- | | | 寄存器 | | | ------------- | | | L1缓存 | | | ------------- | | | L2缓存 | | | ------------- | | | L3缓存 | | | ------------- | ----…

2095.删除链表的中间节点

给你一个链表的头节点 head 。删除链表的中间节点 ,并返回修改后的链表的头节点 head。 长度为 n 链表的中间节点是从头数起第 ⌊n / 2⌋ 个节点(下标从 0 开始),其中 ⌊x⌋ 表示小于或等于 x 的最大整数。 对于 n 1、2、3、4 和…

深入理解 Spring MVC:原理与架构解析

文章目录 前言一、MVC二、Spring MVC三、Spring MVC 工作流程四、小结推荐阅读 前言 Spring MVC 是一种基于 Java 的 Web 应用开发框架,它通过模型-视图-控制器(Model-View-Controller, MVC)的设计模式来组织和管理 Web 应用程序。本文将深入…

树莓派3B读写EEPROM芯片AT24C256

AT24C256是一个Atmel公司的EEPROM存储芯片,容量是256K个bit(也就是32K字节),I2C接口,而树莓派正好有I2C接口,如下图蓝框中的4个IO口, 把AT24C256和这4个口接在一起,这样硬件就准备好…

Nginx的11个执行阶段

Nginx的11个执行阶段

ARCGIS添加在线地图

地图服务地址:http://map.geoq.cn/ArcGIS/rest/services 具体方法: 结果展示:

Spring底层原理之bean的加载方式八 BeanDefinitionRegistryPostProcessor注解

BeanDefinitionRegistryPostProcessor注解 这种方式和第七种比较像 要实现两个方法 第一个方法是实现工厂 第二个方法叫后处理bean注册 package com.bigdata1421.bean;import org.springframework.beans.BeansException; import org.springframework.beans.factory.config.…

轻量级仿 SpringBoot 程序

但凡 Java 程序,想必就是 Spring 程序;但凡 Spring 程序,想必就是 SpringBoot 程序——且慢,当今尚有不是 SpringBoot 即 SpringMVC 的程序不?有——老旧的遗留系统不就是嘛~——不,其实只要稍加“调教”&a…

基于SpringBoot漫画网站系统设计和实现(源码+LW+调试文档+讲解等)

💗博主介绍:✌全网粉丝10W,CSDN作者、博客专家、全栈领域优质创作者,博客之星、平台优质作者、专注于Java、小程序技术领域和毕业项目实战✌💗 🌟文末获取源码数据库🌟 感兴趣的可以先收藏起来,…

目前常见的几款企业级im即时通讯软件有哪些?

在目前的市场上,有几款常见的企业级即时通讯软件广受企业青睐。以下是其中几款主流企业级即时通讯软件的介绍和特点。 1. 微软Teams 微软Teams是一款集即时通讯、协作和视频会议功能于一体的企业级通讯软件。它提供了实时聊天、语音通话、视频会议、文件共享和团队…

零刻SER8 8845HS设置RAID磁盘阵列教程

SER8内置两个NVme硬盘位,支持硬盘RAID功能,目前支持以下几种RAID模式。 Volume(卷):将多块硬盘拼接成一个大硬盘,也称为JBOD(Just a Bunch Of Disks)。它不要求硬盘容量相同&#xf…

软件构造 | 期末查缺补漏

软件构造 | 期末查缺补漏 总体观 软件构造的三维度八度图是由软件工程师Steve McConnell提出的概念,用于描述软件构建过程中的三个关键维度和八个要素。这些维度和要素可以帮助软件开发团队全面考虑软件构建的方方面面,从而提高软件质量和开发效率。 下…

What does the error ‘module ‘langchain‘ has no attribute ‘verbose‘ refer to?

题意:错误 module langchain has no attribute verbose 指的是什么意思? 问题背景: Kind of new to Langchain/Qdrant but Im building a recommendation engine to recommend users based on the contents of their associated PDF files, …

学习阳明心学,需要下真功夫,持续用功

阳明心学是功夫之学,看到善的就发扬光大,看到恶的就立即改正,这才是真功夫

LeetCode 算法:二叉搜索树中第K小的元素 c++

原题链接🔗:二叉搜索树中第K小的元素 难度:中等⭐️⭐️ 题目 给定一个二叉搜索树的根节点 root ,和一个整数 k ,请你设计一个算法查找其中第 k 小的元素(从1开始计数)。 示例 1:…

【web】2、集成插件

1、element-plus 官网地址:设计 | Element Plus 安装 plus 及 icon 图标库 1.1 官网提供plus安装方法: 1.2 官网提供 icon 安装方法 1.3 安装 pnpm install element-plus element-plus/icons-vue main.ts全局安装element-plus,element-plus默认支持语言英语设…

Navicat 外网连接 mysql (1、通过SSH方式内网访问 2、对外开放3306端口)

1、通过SSH方式内网访问 直接常规方式使用IP、账号密码连接,失败 SSH方式: 常规 选项卡中:localhost录入数据库账号密码 SSH 选项卡中:勾选使用SSH,输入服务器IP、账号、密码 如果出现该错误,可能是服务器…

51个图表,完美展示数据分布关系!

本节介绍seaborn展示数据分布关系的图表(Distribution plots)的实现,该类图表用于展示数据集的分布规律,帮助快速获取数据多方面信息,例如,观测值的范围、中心趋势、是否存在某个方向上严重偏斜、是否存在双…