如何前端存token，后端获取token-前端-CSS教程

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

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

使用LocalStorage：

// 存储Token到LocalStorage
localStorage.setItem('token', 'your_token_value');

// 从LocalStorage读取Token
const token = localStorage.getItem('token');

使用SessionStorage：

// 存储Token到SessionStorage
sessionStorage.setItem('token', 'your_token_value');

// 从SessionStorage读取Token
const token = sessionStorage.getItem('token');

使用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;
  }
});

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

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

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestHeader;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class YourController {

    @GetMapping("/your-endpoint")
    public String yourEndpoint(@RequestHeader("Authorization") String token) {
 		// 处理
        return "Su***ess";
    }
}