如何前端存token，后端获取token

Token是一种用于身份验证和授权的令牌（Token）机制，在网络通信中广泛使用。它是一个字符串，代表着用户的身份或权限，用于验证用户在系统中的访问权限。
在身份验证方面，Token通常用于替代传统的基于会话的身份验证机制，如使用Cookie+Session的方式。使用Token进行身份验证的好处是，服务器不需要在内存中保存用户的会话信息，因为Token本身包含了所有验证所需的信息。这使得Token在分布式系统或无状态的API接口中非常适用。Token通常由服务器生成，并在用户登录或进行身份验证时发放给客户端。客户端将Token存储起来，并在后续的请求中将Token作为身份认证的凭证发送给服务器。服务器接收到Token后，可以通过验证Token的有效性来确认用户的身份和权限。常见的Token类型包括JWT（JSON Web Token）、OAuth 2.0的访问令牌（Access Token）、Bearer Token等。

在前端，使用浏览器提供的 Web Storage（如LocalStorage或SessionStorage）或者使用HTTP Cookie来存储Token。

1. 使用LocalStorage：

   // 存储Token到LocalStorage localStorage.setItem('token', 'your_token_value'); // 从LocalStorage读取Token const token = localStorage.getItem('token');
   • 1
   • 2
   • 3
   • 4
   • 5
   • 6

2. 使用SessionStorage：

   // 存储Token到SessionStorage sessionStorage.setItem('token', 'your_token_value'); // 从SessionStorage读取Token const token = sessionStorage.getItem('token');
   • 1
   • 2
   • 3
   • 4
   • 5
   • 6

3. 使用HTTP Cookie：

   // 存储Token到Cookie document.cookie = 'token=your_token_value; expires=...; path=/'; // 从Cookie读取Token const cookies = document.cookie.split(';'); let token = null; cookies.forEach(cookie => { const [name, value] = cookie.trim().split('='); if (name === 'token') { token = value; } });
   • 1
   • 2
   • 3
   • 4
   • 5
   • 6
   • 7
   • 8
   • 9
   • 10
   • 11
   • 12

在前端进行Token验证时，通过在请求头中添加Authorization字段，并将Token值作为其值传递给后端。在后端的代码中，使用@RequestHeader("Authorization") String token来获取请求头中的Token值进行验证和处理。

在Spring Boot后端中，使用@RequestHeader注解来接收前端传递的Token值。
示例：

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13

使用@RequestHeader("Authorization")注解将前端传递的Token值绑定到token参数上。然后，可以在方法体中使用token进行验证和处理。