本文旨在提供一个清晰、健壮的方法来校验JSON Web Token (JWT) Access Token的有效性。我们将讨论如何检查token是否存在于本地存储、是否为undefined、格式是否正确以及是否已过期。通过提供的代码示例和解释，你将能够更好地处理各种token状态，确保你的应用程序安全可靠。

JWT Access Token 有效性校验详解

在使用基于JWT（JSON Web Token）的认证方案时，前端通常会将Access Token存储在本地存储（localStorage）中。在应用程序的生命周期内，我们需要定期或在特定操作前校验token的有效性，以确保用户身份的正确性。以下将详细介绍如何进行校验，并提供相应的代码示例。

1. 检查 Access Token 是否存在

首先，我们需要检查access_token是否存在于localStorage中。localStorage.getItem(‘access_token’) 方法会返回以下两种情况：

• 如果access_token存在，则返回其对应的值。
• 如果access_token不存在，则返回 null。

因此，我们可以直接判断localStorage.getItem(‘access_token’)的返回值是否为 null 来确定 token 是否存在。

2. 检查 Access Token 是否为 “undefined” 字符串

需要注意的是，如果开发者手动将access_token的值设置为undefined（字符串），localStorage.getItem(‘access_token’) 将返回字符串 “undefined”，而不是 JavaScript 中的 undefined 类型。因此，我们需要额外判断返回值是否为字符串 “undefined”。

Poify

快手推出的专注于电商领域的ai作图工具

126

查看详情

3. 检查 Access Token 格式是否正确

在确认 token 存在后，我们需要验证其格式是否正确。JWT 具有特定的格式（由三部分组成，分别是 Header、Payload 和 Signature，并用点号 . 分隔）。如果 token 的格式不正确，尝试解析它将会抛出异常。因此，我们需要使用 try…catch 块来捕获解析 token 时可能发生的错误。

4. 检查 Access Token 是否已过期

JWT 的 Payload 部分通常包含 exp (expiration time) 声明，表示 token 的过期时间，以 Unix 时间戳表示。我们需要将当前时间与 exp 的值进行比较，判断 token 是否已过期。

代码示例

以下是一个完整的代码示例，演示了如何校验 Access Token 的有效性：

function isAccessTokenValid() {   let accessToken = localStorage.getItem('access_token');   let isValid = false;    if (accessToken === null || accessToken === 'undefined') {     // Token 不存在或值为 "undefined"     isValid = false;   } else {     try {       // 尝试解析 token       const decodedToken = parseJwt(accessToken);        // 检查 token 是否已过期       if (Date.now() >= decodedToken.exp * 1000) {         // Token 已过期         isValid = false;       } else {         // Token 有效         isValid = true;       }     } catch (error) {       // Token 格式不正确       isValid = false;     }   }    return isValid; }  // 解析 JWT Token 的函数 (需要根据实际情况实现) function parseJwt(token) {   try {     const base64Url = token.split('.')[1];     const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');     const jsonPayload = decodeURIComponent(atob(base64).split('').map(function(c) {         return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);     }).join(''));      return JSON.parse(jsonPayload);   } catch (error) {     // 处理解析错误，例如 token 格式不正确     console.error("Error parsing JWT:", error);     throw error; // 重新抛出异常，让外层 try...catch 捕获   } }   // 使用示例 if (isAccessTokenValid()) {   console.log("Access Token is valid.");   // 执行需要授权的操作 } else {   console.log("Access Token is invalid.");   // 提示用户重新登录或刷新 token }

注意事项

• 安全性： 永远不要信任客户端的 token 校验结果。服务器端必须进行相同的校验，以确保安全性。
• parseJwt 函数： 代码示例中的 parseJwt 函数用于解析 JWT token。你需要根据你的实际需求实现这个函数。有很多现成的库可以用来解析 JWT，例如 jsonwebtoken。
• 错误处理： 在 try…catch 块中，务必处理解析 token 时可能发生的错误。这有助于防止应用程序崩溃，并提供更好的用户体验。
• Token 刷新： 如果 token 已过期，你应该提示用户重新登录或使用 Refresh Token 刷新 Access Token。

总结

校验 JWT Access Token 的有效性是确保应用程序安全性的重要步骤。通过检查 token 是否存在、格式是否正确以及是否已过期，我们可以有效地防止未经授权的访问。 结合上述代码示例和注意事项，你将能够更好地处理 JWT Access Token，并构建更安全可靠的应用程序。