pref: refresh token

src/error/onRequestError.ts

@@ -1,11 +1,6 @@
-// Global message component (top)
 import Message from '@/components/alert/Message'
-import { generateTokenByRefreshTokenApi } from '@/api'
-// Use the user store
 import { useKUNGalgameUserStore } from '@/store/modules/kungalgamer'
-// Import the router
 import router from '@/router'
-// Import known error handling functions
 import { kungalgameErrorHandler } from './errorHandler'
 
 interface ErrorResponseData {
@@ -18,27 +13,11 @@ interface ErrorResponseData {
  * Then identifies errors based on custom backend status codes
  * If unable to recognize, it throws an error.
  */
-export async function onRequestError(response: Response) {
-  // Identify errors based on status codes
+export const onRequestError = async (response: Response) => {
   if (response.status === 401) {
-    // Attempt to obtain a new token using the refresh token
-    const accessTokenResponse = await generateTokenByRefreshTokenApi()
-
-    // If a new token is successfully obtained, set the token
-    if (accessTokenResponse.code === 200 && accessTokenResponse.data.token) {
-      useKUNGalgameUserStore().setToken(accessTokenResponse.data.token)
-      // Set the page to reload with the new token applied
-      location.reload()
-    } else {
-      // Otherwise, prompt the user to log in again
-      Message(
-        'Login expired, please log in again.',
-        '登陆过期，请重新登陆',
-        'error'
-      )
-      useKUNGalgameUserStore().removeToken()
-      router.push('/login')
-    }
+    Message('Unauthorized', '未认证', 'error')
+    useKUNGalgameUserStore().removeToken()
+    router.push('/login')
     return
   }
 
@@ -51,8 +30,6 @@ export async function onRequestError(response: Response) {
     return
   }
 
-  // Get the error response data
   const data: ErrorResponseData = await response.json()
-  // Handle known errors
   kungalgameErrorHandler(data.code)
 }

src/utils/request.ts

@@ -1,12 +1,8 @@
-// Using the user store
 import { useKUNGalgameUserStore } from '@/store/modules/kungalgamer'
-// Error handling function
-import { onRequestError } from '@/error/onRequestError'
+import { requestRefresh } from './requestRefresh'
 
 type HttpMethod = 'GET' | 'POST' | 'PUT' | 'DELETE'
 
-const successResponseArray = [200, 201, 202, 204, 205, 206]
-
 export type FetchOptions = {
   method: HttpMethod
   credentials: 'include'
@@ -14,7 +10,6 @@ export type FetchOptions = {
   body?: BodyInit
 }
 
-// Fetch request function
 const kunFetchRequest = async <T>(
   url: string,
   options: FetchOptions
@@ -22,7 +17,6 @@ const kunFetchRequest = async <T>(
   const baseUrl = import.meta.env.VITE_API_BASE_URL
   const fullUrl = `${baseUrl}${url}`
 
-  // Add the token to the request headers
   const headers = {
     ...options.headers,
     Authorization: `Bearer ${useKUNGalgameUserStore().getToken()}`,
@@ -30,15 +24,14 @@ const kunFetchRequest = async <T>(
 
   const response = await fetch(fullUrl, { ...options, headers })
 
-  // If not 20X, then throw an error
-  if (!successResponseArray.includes(response.status)) {
-    // Handle errors, such as token expiration
-    await onRequestError(response)
-    throw new Error('KUNGalgame Fetch Error occurred, but no problem')
+  if (response.status === 205) {
+    const newResponseData = await requestRefresh(fullUrl, options)
+    const data: T = await newResponseData.json()
+    return data
+  } else {
+    const data: T = await response.json()
+    return data
   }
-
-  const data: T = await response.json()
-  return data
 }
 
 const fetchGet = async <T>(

src/utils/requestRefresh.ts

@@ -0,0 +1,37 @@
+import Message from '@/components/alert/Message'
+import router from '@/router'
+import { useKUNGalgameUserStore } from '@/store/modules/kungalgamer'
+import { onRequestError } from '@/error/onRequestError'
+import { generateTokenByRefreshTokenApi } from '@/api'
+import type { FetchOptions } from './request'
+
+export const requestRefresh = async (
+  fullUrl: string,
+  options: FetchOptions
+) => {
+  const accessTokenResponse = await generateTokenByRefreshTokenApi()
+
+  if (accessTokenResponse.code === 200 && accessTokenResponse.data.token) {
+    useKUNGalgameUserStore().setToken(accessTokenResponse.data.token)
+  } else {
+    Message(
+      'Login expired, please log in again.',
+      '登陆过期，请重新登陆',
+      'error'
+    )
+    useKUNGalgameUserStore().removeToken()
+    router.push('/login')
+  }
+
+  const headers = {
+    ...options.headers,
+    Authorization: `Bearer ${useKUNGalgameUserStore().getToken()}`,
+  }
+
+  const response = await fetch(fullUrl, { ...options, headers })
+
+  if (!response.ok) {
+    await onRequestError(response)
+  }
+  return response
+}