了解 token,以及使用token作为访问权限的令牌

目录

[1. token的介绍和权限访问控制](#1. token的介绍和权限访问控制)

[1.1. token的概念](#1.1. token的概念)

[1.2. token的创建](#1.2. token的创建)

[1.3. token的作用](#1.3. token的作用)

[2. token的使用](#2. token的使用)

[2.1. 目的](#2.1. 目的)

[2.2. 步骤](#2.2. 步骤)

[2.3. 注意](#2.3. 注意)

[3. 通过token 获取个人资料](#3. 通过token 获取个人资料)

[3.1. 语法](#3.1. 语法)

[3.2. 问题](#3.2. 问题)

[3.3. 解决](#3.3. 解决)

[4. axios请求拦截器](#4. axios请求拦截器)

[4.1. axios 请求拦截器介绍](#4.1. axios 请求拦截器介绍)

[4.2. axios 请求拦截器,什么时候使用?](#4.2. axios 请求拦截器,什么时候使用?)

[5. axios响应拦截器](#5. axios响应拦截器)

[5.1. axios 响应拦截器介绍](#5.1. axios 响应拦截器介绍)

[5.2. axios 响应拦截器,什么时候触发成功/失败的回调函数?](#5.2. axios 响应拦截器,什么时候触发成功/失败的回调函数?)


1. token的介绍和权限访问控制

1.1. token的概念

  • 访问权限的令牌,本质上是一串字符串

1.2. token的创建

  • 正确登录后,由后端签发并返回

1.3. token的作用

  • 判断是否有登录状态等,控制访问权限

2. token的使用

2.1. 目的

  • 只有登录状态,才可以访问内容页面

2.2. 步骤

  • 在 utils/auth.js 中判断无 token 令牌字符串,则强制跳转到登录页
  • 在登录成功后,保存 token 令牌字符串到本地,再跳转到首页

2.3. 注意

  • 前端只能判断 token 的有无
  • 后端通过解密可以提取 token 字符串的原始信息,判断有效性

3. 通过token 获取个人资料

3.1. 语法

  • axios 可以在 headers 选项传递请求头参数

3.2. 问题

  • 很多页面,都需要获取访问权限
  • 很多接口,都需要携带 token 令牌字符串

3.3. 解决

  • 在请求拦截器统一设置公共 headers 选项

4. axios请求拦截器

4.1. axios 请求拦截器介绍

  • 发起请求之前,触发的配置函数,对请求参数进行额外配置

4.2. axios 请求拦截器,什么时候使用?

  • 有公共配置和设置时,统一设置在请求拦截器中

5. axios响应拦截器

5.1. axios 响应拦截器介绍

  • 响应回到 then/catch 之前,触发的拦截函数,对响应结果统一处理

例如:身份验证失败,统一判断并做处理

5.2. axios 响应拦截器,什么时候触发成功/失败的回调函数?

  • 状态为 2xx 触发成功回调,其他则触发失败的回调函数
相关推荐
kyriewen19 分钟前
前端错误监控最全指南:捕获 JS 异常、Promise 拒绝、资源加载失败,附上报代码
前端·javascript·监控
狗哥哥31 分钟前
船队运营可视化技术方案
前端
大家的林语冰34 分钟前
ESLint 近期动态大全,新版本正式发布,antfu 大佬推荐的插件也更新了!
前端·javascript·前端工程化
只会cv的前端攻城狮35 分钟前
DSL 领域模型架构设计:消灭 CRUD 重复工作
前端·架构
码事漫谈1 小时前
时序数据库2026盘点:国产数据库如何以“融合多模”走出差异化之路?
前端·后端
道友可好1 小时前
让 AI 自己验收,等于让学生自己批卷
前端·人工智能·后端
yingyima2 小时前
Go 语言正则表达式速查手册:30 分钟掌握核心语法与实战技巧
前端
大蝴蝶博努奇a2 小时前
使用ChatGPT 解决各类代码报错
前端
胡志辉2 小时前
深入浅出 call、apply、bind
前端·javascript·后端
iccb10132 小时前
5年,一个程序员是如何把私有化在线客服系统做到第一名的
前端·后端·github