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

密文:eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcGVuZElkIjoiMTIzNDU2IiwiaWF0IjoxNjY5NzE1MTY5NzMwLCJleHAiOjE2Njk3MjIzNjk3MzB9.HOxtQuxMgEplqJT2zcowttMlutS4Wd-Q73HWUygzrts

验证密文是否正确

 JSON Web Tokens - jwt.io

 JWT官网加密得到的密文与代码生成的密文一致,说明代码实现正确。

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐