JS 生成JWT (代码可直接使用)-CFANZ编程社区

JS 生成JWT (代码可直接使用)

JWT介绍

使用JavaScript实现JWT鉴权_秦一scar的博客-CSDN博客_js jwt

代码实现

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <p>generate token</p>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.js"></script></head>
    <script type="text/javascript">
      function base64UrlEncode(str) {
         var encodedSource = CryptoJS.enc.Base64.stringify(str);
         var reg = new RegExp('/', 'g');
         encodedSource = encodedSource.replace(/=+$/,'').replace(/\+/g,'-').replace(reg,'_');
         return encodedSource;
      }

      function generateToken(secretSalt) {
        let header = JSON.stringify({
        "alg": "HS256",
        "typ": "JWT"
        })

        var iat = new Date().getTime()
        var exp = iat + 2*60*60*1000
        console.log(exp-iat);
        let payload =JSON.stringify({
          "opendId": "123456",
          "iat": iat,
          "exp": exp,
        })

        let before_sign = base64UrlEncode(CryptoJS.enc.Utf8.parse(header)) + '.' + base64UrlEncode(CryptoJS.enc.Utf8.parse(payload));
        let signature =CryptoJS.HmacSHA256(before_sign, secretSalt);
        signature = base64UrlEncode(signature);
        let final_sign = before_sign + '.' + signature;
        return final_sign;
      }
      
      console.log(generateToken("code2022"));
    </script>
  </body>
</html>

以上可以直接复制进html文件，直接运行。浏览器选择开发模式，进入console窗口即可看到token

JS 生成JWT (代码可直接使用)_ecmascript

密文：eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcGVuZElkIjoiMTIzNDU2IiwiaWF0IjoxNjY5NzE1MTY5NzMwLCJleHAiOjE2Njk3MjIzNjk3MzB9.HOxtQuxMgEplqJT2zcowttMlutS4Wd-Q73HWUygzrts