介绍
redux-session-manager 是一个处理 Redux 应用程序中会话的 npm 包。它可以帮助前端开发人员更轻松地管理应用程序中的用户会话，包括用户身份验证和身份验证令牌。
安装
在项目中安装 redux-session-manager：
npm install redux-session-manager --save
使用
初始化 store
首先，在您的 Redux store 中导入 sessionReducer：
-- -------------------- ---- ------- ------ - ---------------- ----------- - ---- -------- ------ - -------------- - ---- ------------------------ ----- -------- - ----------------- -------- --------------- -- ---- -------- --- ----- ----- - ----------------------
配置
您需要在应用程序中设置 Redux Session Manager 配置，配置选项可以设置 Cookie 名称、Cookie 路径、Cookie 过期时间、Cookie 安全标志和白名单。 可以在应用程序初始化期间对其进行全局配置：
-- -------------------- ---- ------- ------ - -------------- - ---- ------------------------ ----- ------------- - - ----------- ---------- -- ------ -- ----------- ------ -- ------ ---- ----- ---- -- ------ -- ------- ----- -- ------ ---- ---------- --- -- ---- -- ----------------------------------
登录
如果用户通过身份验证，那么可以将身份验证令牌放入 sessionStorage 中，然后在 Redux store 中创建会话：
-- -------------------- ---- ------- ------ - ------------- - ---- ------------------------ -- --------- ---- -------------- -------- ----- --------- - ------------------------------------ -- ----------- - ----- ----------- - - ------ --------- -- ------------------------------------------- -
结束会话
用户可以通过退出应用程序或清除其浏览器中的 sessionStorage 来关闭其会话。您可以在 React 中定义一个按钮或链接来结束用户的会话：
import { destroySession } from 'redux-session-manager';
function logout() {
store.dispatch(destroySession());
}获取会话数据
您可以在应用程序中的任何组件中获取当前用户会话：
import { getSessionData } from 'redux-session-manager';
const sessionData = getSessionData(store.getState());
console.log('currentUser:', sessionData.currentUser);示例
以下示例代码演示如何在 React 应用程序中使用 Redux Session Manager。
App.js
-- -------------------- ---- -------
------ - -------------- - ---- ------------------------
------ - -------------- --------------- -------------- - ---- ------------------------
------ - ----------- - ---- --------
------ - -------- - ---- --------------
------ ------ - -------- - ---- --------
------ - -------------- - ---- ------------------------
----- ------------- - -
----------- ----------
----------- ------
----- ----
------- -----
---------- ---
--
----------------------------------
----- -------- - -
-------- ---------------
--
----- ----- - ----------------------
-------- ----- -
----- ---------- ------------ - ---------------------------------------------
----- ----------- - -- -- -
----- ----- - -------------
----- ----------- - - ----- --
-------------------------------------------
------------------
--
----- ------------ - -- -- -
---------------------------------
-------------------
--
------ -
--------- --------------
-----
--------- -- -
-----
------------
------- ----------------------------------
------
--
---------- -- -
-----
----------
------- ---------------------------------
------
--
------
-----------
--
-
------ ------- ----index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(<App />, document.getElementById('root'));结论
Redux Session Manager 提供了管理 Redux 应用程序中用户会话的一种简单方法。使用 Redux Session Manager，前端开发人员可以更轻松地管理用户会话，包括用户身份验证和身份验证令牌。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600560bf81e8991b448df06e