jwt具体是什么

jwt具体是什么

JWT(JSON Web Token)认证方式是一种基于令牌的认证机制,广泛应用于前后端分离的系统中。它通过生成、传递和验证一个加密的令牌(Token),来实现用户身份认证和授权。

JWT 的基本结构

JWT 由三部分组成,用 . 分隔:

  1. Header(头部)
    • 包含令牌的类型(通常是 JWT)和签名算法(如 HMAC SHA256)。
json 复制代码
{
  "alg": "HS256",
  "typ": "JWT"
}
  1. Payload(载荷)
    • 包含声明信息(claims),用于存储用户信息或其他元数据。
    • Claims 可以分为三类:
      • Registered claims (已注册声明):如 iss(签发者)、exp(过期时间)、iat(签发时间)。
      • Public claims(公共声明):由开发者定义的公开信息,如用户 ID、角色。
      • Private claims(私有声明):应用内自定义的非公开信息。
json 复制代码
{
  "sub": "1234567890",
  "name": "John Doe",
  "admin": true,
  "iat": 1516239022
}
  1. Signature(签名)
    • 用于验证数据完整性,防止数据被篡改。
    • 生成方式:将 Header 和 Payload 使用 Base64URL 编码后拼接起来,并用密钥和算法进行签名。
scss 复制代码
HMACSHA256(
  base64UrlEncode(header) + "." +
  base64UrlEncode(payload),
  secret
)

最终生成的 JWT 类似于以下格式:

复制代码
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWUsImlhdCI6MTUxNjIzOTAyMn0.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c

JWT 认证的工作流程

  1. 用户登录
    • 用户使用用户名和密码登录,服务器验证通过后生成 JWT,并将其返回给客户端。
  1. 客户端存储 JWT
    • 客户端通常将 JWT 存储在本地存储(localStorage)或浏览器的 Cookie 中。
  1. 请求时携带 JWT
    • 客户端在每次请求时,将 JWT 添加到 HTTP 请求头中:
makefile 复制代码
Authorization: Bearer <JWT>
  1. 服务器验证 JWT
    • 服务器接收到请求后,解析 JWT,验证签名和有效期。
    • 如果验证通过,则允许访问资源;否则返回 401(未授权)。

JWT 认证的优点

  1. 跨平台:JWT 是 JSON 格式,可以被多种语言解析和使用。
  1. 无状态:JWT 是无状态的,服务器无需存储会话信息,减少了服务器压力。
  1. 灵活性:Payload 中可以存储多种类型的信息。

JWT 的缺点

  1. 安全性问题
    • 如果密钥泄露,攻击者可以伪造 JWT。
    • 如果令牌被截获,可能会被重用(可以通过 HTTPS 和短期有效期减轻此问题)。
  1. 无法主动注销
    • 由于 JWT 无需存储在服务器端,服务器无法主动使某个令牌失效,除非使用黑名单机制。
  1. 令牌大小较大
    • 包含了 Header、Payload 和 Signature,在每次请求中都会传输,可能增加网络负担。

JWT 的使用场景

  • 用户认证:前后端分离的登录认证。
  • 微服务通信:服务之间基于 JWT 进行身份验证。
  • 移动应用:使用 JWT 在移动端管理用户身份。

如需实现,推荐配合 Node.js 的 jsonwebtoken 库,方便快速生成和验证 JWT。

相关推荐
满分观察网友z1 分钟前
组件递归:Vue中动态文章与目录的同步艺术
前端
阿杰技术2 分钟前
Dockerfile配置基于 Python 的 Web 应用镜像
java·前端·python
10年前端老司机29 分钟前
React 常用hooks 总结
前端·javascript·react.js
江城开朗的豌豆30 分钟前
Vue移动端适配实战:我用rem搞定各种奇葩屏幕!
前端·javascript·vue.js
江城开朗的豌豆39 分钟前
Vue生命周期那些事儿 - 为什么我总在mounted里发请求?
前端·javascript·vue.js
江城开朗的豌豆41 分钟前
Vue指令封装大揭秘!这些高频指令我都在用,你封装了几个?
前端·javascript·vue.js
古时的风筝43 分钟前
「独立开发」出海数据库用啥?
前端·后端·程序员
大怪v1 小时前
14KB!前端首屏优化的生死界限💀💀💀
前端·javascript·面试
前端小巷子1 小时前
npx前端版本控制利器
前端·javascript·面试
lq_ioi_pl1 小时前
XSS GAME靶场
前端·javascript·xss