如何前端存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:

    javascript 复制代码
    // 存储Token到LocalStorage
    localStorage.setItem('token', 'your_token_value');
    
    // 从LocalStorage读取Token
    const token = localStorage.getItem('token');
  2. 使用SessionStorage:

    javascript 复制代码
    // 存储Token到SessionStorage
    sessionStorage.setItem('token', 'your_token_value');
    
    // 从SessionStorage读取Token
    const token = sessionStorage.getItem('token');
  3. 使用HTTP Cookie:

    javascript 复制代码
    // 存储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值。

示例:

java 复制代码
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 "Success";
    }
}

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

相关推荐
玩AI的奶茶5 小时前
GPU 算力租赁平台横向对比:六家主流平台,24GB 档价差 85%
服务器·人工智能·gpu算力·token·算力租赁
江屿风1 天前
【Plain Language Large Model】【大语言模型底层原理全解析:从Token生成到智能体演进】流食般投喂
人工智能·笔记·语言模型·llm·json·token·聊天模板
星野云联AIoT技术洞察4 天前
ESP32 接入 Meta Muse:Gadget SDK 能做什么,为什么不能直接做商业设备
esp32·agent·token·边缘ai·meta muse·mcu选型
smilejingwei9 天前
不用大模型不烧 token 能把智能问数做到啥程度?
大模型·token·智能问数·nlq
救救孩子把11 天前
AI面试八股文-01_1-LLM基础概念(Token-上下文窗口-幻觉)
人工智能·面试·职场和发展·llm·token
玩AI的奶茶15 天前
从零到跑通:在算家云上部署大模型的完整操作手册(实例创建 / 镜像选择 / 远程连接 / 成本控制)
人工智能·ai·gpu算力·token·算力租赁
信马堂16 天前
WorkBuddy 接入第三方模型 API 全流程:安装与配置实录
人工智能·大模型·token·ai算力·workbuddy
liangshanbo121517 天前
面试题:AI 产品里,前端怎么降低 Token 消耗?
token
xiangshangdemayi17 天前
Strata教程:让GISer真正实现了token自由
ai·gis·教程·token·strata·自由
网络毒刘18 天前
Token 用量观测实战:从会话结构拆前缀/工具/生成,建立个人降本仪表盘
人工智能·性能优化·token·cursor