LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

【HTML】前端跳转如何携带Token?

admin
2024年4月9日 22:51 本文热度 484

在前端项目中,登录成功后获取Token值,然后在后续的请求中都需要在请求头中携带这个Token,这是一种常见的做法。这种情况下,你可以选择使用LocalStorage或者SessionStorage来存储Token。

  1. 「LocalStorage」:这是HTML5提供的一种在客户端存储数据的方式,数据会永久保存,除非用户手动清除。你可以在登录成功后,将Token存储到LocalStorage中。
localStorage.setItem('token''your token');

然后在每次发送请求时,都从LocalStorage中获取Token,并添加到请求头中。

let token = localStorage.getItem('token');
axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;
  1. 「SessionStorage」:与LocalStorage类似,SessionStorage也是HTML5提供的一种在客户端存储数据的方式。但是SessionStorage中存储的数据在页面会话结束时会被清除。页面会话在浏览器打开期间一直保持,并在浏览器关闭时结束。如果你希望在用户关闭浏览器后,Token被清除,可以选择使用SessionStorage。

存储Token:

sessionStorage.setItem('token''your token');

获取Token并添加到请求头中:

let token = sessionStorage.getItem('token');
axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;

注意:以上的代码示例使用了axios库来发送HTTP请求,如果你使用的是其他库,比如fetch,设置请求头的方式可能会有所不同。

另外,存储Token时要注意安全问题,避免XSS攻击。


该文章在 2024/4/9 22:51:42 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved