Angular 4中检查非JWT OAuth令牌过期时间及编码情况咨询

Hey there! Let's break this down for you since you're working with Angular 4 as the frontend for an ASP.NET Web API backend, using non-JWT OAuth tokens.

一、你的令牌是否编码了过期时间？ #

首先要明确：非JWT格式的OAuth令牌（通常叫不透明令牌/Opaque Token）和JWT完全不同。JWT是三段式可解码的字符串，会把过期时间、用户信息等明文编码在令牌里；但不透明令牌只是一串无意义的随机字符，它的所有关联数据（包括过期时间、权限、用户信息）都存在OAuth服务器端，客户端没办法直接解析出任何有效内容。

你可以通过这两种方式确认：

• 看令牌格式：如果是JWT，会有两个.分隔的三段结构，用Base64解码就能读出内容；如果是不透明令牌，就是一段没有分隔符的随机字符串，解码后也读不出有用信息。
• 调用OAuth服务器的令牌 introspection 接口（如果服务器支持）：这是OAuth标准接口，把令牌发给服务器后，它会返回令牌的详细元数据，其中就包含过期时间（exp字段）、是否有效等信息。

二、如何在Angular 4中检查令牌过期时间？ #

因为客户端没法直接解析不透明令牌的过期时间，通常有两种可行方案：

方案1：存储令牌时同步保存过期时间 #

当你从OAuth服务器获取令牌时，响应里一般会返回expires_in字段（表示令牌有效期，单位是秒）。你可以在拿到令牌的同时，计算出具体的过期时间点（当前时间 + expires_in秒），然后把令牌和过期时间一起存在本地存储（比如localStorage或sessionStorage）。

Angular 4里的示例代码：

// 假设从服务器拿到的令牌响应
const tokenResponse = {
  access_token: 'your-opaque-token-string',
  expires_in: 3600, // 示例：1小时有效期
  token_type: 'Bearer'
};

// 计算过期时间戳（毫秒）
const expiryTimestamp = new Date().getTime() + (tokenResponse.expires_in * 1000);

// 存储到本地
localStorage.setItem('access_token', tokenResponse.access_token);
localStorage.setItem('token_expiry', expiryTimestamp.toString());

之后需要检查过期状态时，取出存储的时间戳和当前时间对比：

const currentTime = new Date().getTime();
const storedExpiry = parseInt(localStorage.getItem('token_expiry') || '0', 10);

if (currentTime > storedExpiry) {
  // 令牌已过期，触发重新认证逻辑
  console.log('Token expired, please re-login');
}

方案2：调用令牌 introspection 接口验证 #

如果你的ASP.NET OAuth服务器支持令牌 introspection 接口（可以通过扩展实现），你可以在Angular里发起请求到这个接口，传入令牌，服务器会返回令牌的真实状态和过期时间。

示例代码（用Angular 4的HttpClient）：

import { HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) {}

verifyTokenStatus(token: string) {
  return this.http.post('/oauth/introspect', {
    token: token,
    client_id: 'your-client-id',
    client_secret: 'your-client-secret' // 部分服务器需要客户端认证
  }).subscribe((response: any) => {
    if (response.active) {
      const expiresAt = new Date(response.exp * 1000);
      console.log('Token expires at:', expiresAt);
      if (new Date() > expiresAt) {
        console.log('Token has expired');
      }
    } else {
      console.log('Token is invalid or already expired');
    }
  });
}

注意：调用这个接口一定要用HTTPS，避免泄露令牌和客户端密钥这类敏感信息。

三、额外提醒 #

• 本地存储的过期时间只是参考，令牌的真实有效性最终由OAuth服务器决定——服务器可能会提前吊销令牌，所以在关键请求前最好做一次验证。
• 建议在Angular 4里封装一个专门的令牌管理服务，统一处理令牌的存储、过期检查、刷新逻辑，这样代码更易维护。

内容的提问来源于stack exchange，提问作者Mostafa