feat: add token type in local mode

Author: hubert

clients/vue-web/src/auth/local/helper.ts

@@ -1,15 +1,21 @@
 import { storage } from '@/store/utils';
 
-const TOKEN_KEY = 'token';
+const ACCESS_TOKEN_KEY = 'access-token',
+  TOKEY_TYPE_KEY = 'token-type';
 
 export function getToken() {
-  return storage.get(TOKEN_KEY);
+  return {
+    accessToken: storage.get(ACCESS_TOKEN_KEY),
+    tokenType: storage.get(TOKEY_TYPE_KEY),
+  };
 }
 
-export function setToken(token: string) {
-  return storage.set(TOKEN_KEY, token);
+export function setToken(token: string, type = 'Baerer') {
+  storage.set(ACCESS_TOKEN_KEY, token);
+  storage.set(TOKEY_TYPE_KEY, type);
 }
 
 export function removeToken() {
-  return storage.remove(TOKEN_KEY);
+  storage.remove(ACCESS_TOKEN_KEY);
+  storage.remove(TOKEY_TYPE_KEY);
 }

clients/vue-web/src/auth/local/index.ts

@@ -5,6 +5,10 @@ import { i18n } from '@/i18n';
 import { UserManager, type IUser, type ISigninArgs, type ISignoutArgs } from '../user-manager';
 import { getToken, setToken, removeToken } from './helper';
 
+export interface UserManagerOptions {
+  filterProtocolClaims?: boolean | string[];
+}
+
 /**
  * Protocol claims that could be removed by default from profile.
  * Derived from the following sets of claims:
@@ -38,14 +42,23 @@ class Timer {
 class User implements IUser {
   payload: JwtPayload;
 
-  constructor(private readonly token: string, private readonly options: { filterProtocolClaims?: boolean | string[] }) {
+  constructor(
+    private readonly token: string,
+    private readonly options: UserManagerOptions & {
+      tokenType?: string;
+    },
+  ) {
     this.payload = jwtDecode(token);
   }
 
   get access_token() {
     return this.token;
   }
 
+  get token_type() {
+    return this.options.tokenType ?? 'Bearer';
+  }
+
   get profile() {
     const result = { ...this.payload } as IUser['profile'];
 
@@ -85,14 +98,15 @@ class User implements IUser {
 }
 
 export class LocalUserManagerCreator extends UserManager {
-  constructor(private readonly options: { filterProtocolClaims?: boolean | string[] } = {}) {
+  constructor(private readonly options: UserManagerOptions = {}) {
     super();
   }
 
   getUser(): Promise<IUser | null> {
-    const token = getToken();
-    if (token) {
-      return Promise.resolve(new User(token, this.options));
+    const { accessToken, tokenType } = getToken();
+    if (accessToken) {
+      const user = new User(accessToken, { tokenType, ...this.options });
+      return Promise.resolve(user);
     }
     return Promise.resolve(null);
   }

clients/vue-web/src/auth/user-manager.ts

@@ -1,5 +1,6 @@
 export interface IUser {
   access_token: string;
+  token_type: string;
   /** The claims represented by a combination of the id_token and the user info endpoint */
   get profile(): {
     sub: string;

clients/vue-web/src/fetch/graphql/basic.ts

@@ -54,15 +54,18 @@ export const basicLink = split(
       const instance = Authoriztion.getInstance(),
         authType = instance.type,
         userManager = instance.userManager,
-        token = await userManager
+        authorization = await userManager
           .getUser()
-          .then((user) => user?.access_token)
+          .then((user) => {
+            if (!user || user.expired) return '';
+            return [user.token_type, user.access_token].filter(Boolean).join(' ');
+          })
           .catch(() => '');
       const headers = {
         apikey: `pomelo-${authType}`,
       };
 
-      token && (headers['Authorization'] = `Bearer ${token}`);
+      authorization && (headers['Authorization'] = authorization);
       i18n.locale && (headers['x-custom-locale'] = i18n.locale);
 
       return headers;

clients/vue-web/src/fetch/graphql/identity.ts

@@ -28,15 +28,18 @@ export const identityLink = from([
     const instance = Authoriztion.getInstance(),
       authType = instance.type,
       userManager = instance.userManager,
-      token = await userManager
+      authorization = await userManager
         .getUser()
-        .then((user) => user?.access_token)
+        .then((user) => {
+          if (!user || user.expired) return '';
+          return [user.token_type, user.access_token].filter(Boolean).join(' ');
+        })
         .catch(() => '');
     const headers = {
       apikey: `pomelo-${authType}`,
     };
 
-    token && (headers['Authorization'] = `Bearer ${token}`);
+    authorization && (headers['Authorization'] = authorization);
     i18n.locale && (headers['x-custom-locale'] = i18n.locale);
 
     return headers;

clients/vue-web/src/login/fetch/index.ts

@@ -3,20 +3,25 @@ import { defineRegistGraphql, gql } from '@ace-fetch/graphql-vue';
 // Types
 import type { TypedMutationDocumentNode } from '@ace-fetch/graphql';
 
-export interface UserVerifyInput {
+export interface SignInVerifyInput {
   // 用户名
   username: string;
   // 密码
   password: string;
 }
 
-export interface UserVerifySuccessResult {
+export interface SignInVerifySuccessResult {
   // 是否登录成功
   success: true;
-  token: string;
+  // access token
+  accessToken: string;
+  // token type
+  tokenType: string;
+  // 过期时间
+  expiresAt: number;
 }
 
-export interface UserVerifyFaildResult {
+export interface SignInVerifyFaildResult {
   // 是否登录成功
   success: false;
   message: string;
@@ -34,16 +39,18 @@ export interface ModifyPasswordInput {
 export const useLoginApi = defineRegistGraphql('login', {
   definition: {
     signIn: gql`
-      mutation signIn($model: VerifyUserInput!) {
+      mutation signIn($model: SignInInput!) {
         result: signIn(model: $model) {
           success
-          token
+          accessToken
+          tokenType
+          expiresAt
           message
         }
       }
     ` as TypedMutationDocumentNode<
-      { result: UserVerifySuccessResult | UserVerifyFaildResult },
-      { model: UserVerifyInput }
+      { result: SignInVerifySuccessResult | SignInVerifyFaildResult },
+      { model: SignInVerifyInput }
     >,
     modifyPassword: gql`
       mutation updateUserPassword($model: UpdateUserPasswordInput!) {

clients/vue-web/src/login/views/login/index.tsx

@@ -60,7 +60,7 @@ export default Form.create({})(
             })
             .then(({ result }) => {
               if (result.success) {
-                setToken(result.token);
+                setToken(result.accessToken, result.tokenType);
                 message.success({
                   content: i18n.tv('page_login.form.submit_success', '登录成功!') as string,
                   onClose: redirect,

clients/vue-web/src/views/post/desktop.tsx

@@ -2,10 +2,9 @@ import moment from 'moment';
 import hljs from 'highlight.js/lib/core';
 import Lazyload from 'lazyload';
 import { defineComponent, computed, onMounted } from '@vue/composition-api';
-import { TemplatePageType } from '@ace-pomelo/shared/client';
 import { useI18n } from '@/composables';
 import { useLocationMixin } from '@/mixins';
-import { PostMetaPresetKeys } from '@/fetch/apis';
+import { PostMetaPresetKeys, TemplatePageType } from '@/fetch/apis';
 import { safeJSONParse } from '@/utils';
 import classes from './desktop.module.less';
 

clients/vue-web/src/views/post/mobile.tsx

@@ -2,10 +2,9 @@ import moment from 'moment';
 import hljs from 'highlight.js/lib/core';
 import Lazyload from 'lazyload';
 import { defineComponent, computed, onMounted } from '@vue/composition-api';
-import { TemplatePageType } from '@ace-pomelo/shared/client';
 import { useI18n } from '@/composables';
 import { useLocationMixin } from '@/mixins';
-import { PostMetaPresetKeys } from '@/fetch/apis';
+import { PostMetaPresetKeys, TemplatePageType } from '@/fetch/apis';
 import { safeJSONParse } from '@/utils';
 import classes from './mobile.module.less';
 

servers/infrastructure-bff/src/app.module.ts

@@ -161,8 +161,10 @@ const logger = new Logger('AppModule', { timestamp: true });
     AuthorizationModule.forRootAsync({
       isGlobal: true,
       useFactory: async (config: ConfigService) => {
-        const { keys } = await getJWKS([config.get('PRIVATE_KEY')].filter(Boolean) as string[]);
+        const privateKey = config.get('PRIVATE_KEY');
+        const { keys } = await getJWKS([privateKey].filter(Boolean) as string[]);
         return {
+          signingKey: await getSigningKey(privateKey),
           verifyingKey: createLocalJWKSet({
             keys: keys.map((jwk) => ({
               kty: jwk.kty,
@@ -302,7 +304,6 @@ const logger = new Logger('AppModule', { timestamp: true });
     UserModule.forRootAsync({
       useFactory: async (config: ConfigService) => ({
         isGlobal: true,
-        signingKey: await getSigningKey(config.get('PRIVATE_KEY')),
         tokenExpiresIn: config.get('JWT_EXPIRES_IN'),
       }),
       inject: [ConfigService],