token的使用流程以及 JWT构成和构建

冷不防 2022-12-30 11:59 136阅读 0赞

## 1.什么是token ##

token是一个令牌，是前后端开发时的一个验证工具，（就是一个字符串）

**我们先解释一下他的含义：**

1、Token的引入：Token是在客户端频繁向服务端请求数据，服务端频繁的去数据库查询用户名和密码并进行对比，判断用户名和密码正确与否，并作出相应提示，在这样的背景下，Token便应运而生。

2、Token的定义：Token是服务端生成的一串字符串，以作客户端进行请求的一个令牌，当第一次登录后，服务器生成一个Token便将此Token返回给客户端，以后客户端只需带上这个Token前来请求数据即可，无需再次带上用户名和密码。

3、使用Token的目的：Token的目的是为了减轻服务器的压力，减少频繁的查询数据库，使服务器更加健壮。

了解了Token的意义后，我们就更明确的知道为什么要用他了

## 2.token的使用流程 ##

1.前端向后端传递用户名和密码
    
    2.后端将接收到的的用户名和密码进行核实
    
    3.后端核实成功后会，返回给前端一个token（或者直接将token保存在cookie中）；
    
    4.前端得到token 并对其进行保存
    
    5.如果前端请求隐私的接口（比如需要登陆后才能查看商品的详细信息），则需要传递保存的token（进行ajax请求时，将信息放在请求头中）
    
    6.后端对其进行验证，如果token错误，则请求不到数据，返回给前端相应的提示
       　　　　　　　 如果token验证正确，则 获取相应的数据，并返回给前端

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70][]

## 3.JWT的构成 ##

JWT是由三部分构成，将这三段信息文本用链接构成了JWT字符串，    header + payload +secret = 加密的字符串
    1.header 头部
    
    2.payload 负载-------写相关的信息
    　　{
    　　　　user:"签发者"，
    　　　　exp:"token过期时间"//必须大于签发时间
    　　}
    
    3.secret 密钥------用来进行jwt的签发和jwt的验证，它就是你服务端的私钥，在任何场景都不应该流露出去实际的 JWT 大概就像下面这样

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 1][]

它是一个很长的字符串，中间用点（`.`）分隔成三个部分。注意，JWT 内部是没有换行的，这里只是为了便于展示，将它写成了几行。

JWT 的三个部分依次如下。

>  *  Header（头部）
>  *  Payload（负载）
>  *  Signature（签名）

写成一行，就是下面的样子。

>     Header.Payload.Signature

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 2][]

### 1 Header ###

Header 部分是一个 JSON 对象，描述 JWT 的元数据，通常是下面的样子。

>     {
>       "alg": "HS256",
>       "typ": "JWT"
>     }

上面代码中，`alg`属性表示签名的算法（algorithm），默认是 HMAC SHA256（写成 HS256）；`typ`属性表示这个令牌（token）的类型（type），JWT 令牌统一写为`JWT`。

最后，将上面的 JSON 对象使用 Base64URL 算法（详见后文）转成字符串。

### 2 Payload ###

Payload 部分也是一个 JSON 对象，用来存放实际需要传递的数据。JWT 规定了7个官方字段，供选用。

>  *  iss (issuer)：签发人
>  *  exp (expiration time)：过期时间
>  *  sub (subject)：主题
>  *  aud (audience)：受众
>  *  nbf (Not Before)：生效时间
>  *  iat (Issued At)：签发时间
>  *  jti (JWT ID)：编号

除了官方字段，你还可以在这个部分定义私有字段，下面就是一个例子。

>     {
>       "sub": "1234567890",
>       "name": "John Doe",
>       "admin": true
>     }

注意，JWT 默认是不加密的，任何人都可以读到，所以不要把秘密信息放在这个部分。

这个 JSON 对象也要使用 Base64URL 算法转成字符串。

## 4.后端JWT的构建 ##

// 1.下载包
            npm install jsonwebtoken --save-dev
    
        // 2.引入
            var JWT = require("jsonwebtoken");
        //负载信息
        let payload = {
            user:"sun",
            // exp:"1000 * 60"//单位 ms
        }
        //密钥
         let secret = "123456";
         //生成token，exporesIn为过期时间，单位：ms/h/days/d  eg:1000, "2 days", "10h", "7d"
        let token= JWT.sign(payload,secret,{expiresIn:"1h"})
        //将token保存在cookie中
        res.cookie("token",token);

## 5.前端请求保密性的信息（比如：必须登录后，才能查看商品的详细信息），发送JWT ##

//获取cookie，
        var token = $.cookie("token");
        //发起ajax请求,将token发送到后端
        $.ajax({
            type: "get",
            url: "/goods",
            //将信息保存在请求头中
            headers: {
                auth: token
            }
    
        })

## 6.后端验证JWT ##

//获取前端传来的tokenlet token = req.headers.auth；
      JWT.verify(token, "密钥", (err, decoded) => {
        if (err) {
                //验证失败
                //console.log("令牌失效");
                res.json({
                    status:false,
                    info:"令牌失效"
                })
            } else {
                //验证成功
                //获取前端需要的相应数据
    　　　　　　　　//返回给前端相应的信息
    　　　　　　　　 res.json({
                    status:true,
                    info:请求的数据
                })
            }
        })

## 总结 ##

### [token简单的使用流程。][token]（nodejs） ###

Token的作用主要有两个，一是防止表单重复提交，二是验证身份。

Token使用的流程：

1 首先安装第三方依赖cnpm install jsonwebtoken --save-dev

2 在controller层引入第三方依赖：const JWT = require（“jsonwebtoken”）

3 定义头部：let header = \{一般第一JWT的信息和签名使用的方法\}

4 定义负载：let payload = \{有固定的格式\}

5 定义秘钥：let secret = “”；

6 将三部分用base64编码后将三部分拼接起来。

Let token = JWT.sign（payload,secret,\{expiresIn : “10h”\}）;

7 将token存入cookie中：res.cookie(“token”,token)

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70]: /images/20221120/04dc8488489449f1ba83b9fd63fe5c17.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20201225133930105.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20201225134023327.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3htMTAzNzc4Mjg0Mw==,size_16,color_FFFFFF,t_70
[token]: https://www.cnblogs.com/PrayLs/p/10301210.html