feat: add auto-refreshing tokens to plugin and directus handler.

Intevel · Apr 27, 2023 · 570fbdf · 570fbdf
1 parent 764d02e
commit 570fbdf
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 3 deletions.
diff --git a/src/module.ts b/src/module.ts
@@ -18,6 +18,12 @@ export interface ModuleOptions {
    * @type boolean
    */
   autoFetch?: boolean;
+  /**
+   * Auto refesh tokens
+   * @default true
+   * @type boolean
+   */
+  autoRefresh?: boolean;
   /**
    * fetch user params
    * @type boolean
@@ -60,6 +66,7 @@ export default defineNuxtModule<ModuleOptions>({
   defaults: {
     url: process.env.NUXT_DIRECTUS_URL,
     autoFetch: true,
+    autoRefresh: false,
     devtools: false,
     cookieNameToken: 'directus_token',
     cookieNameRefreshToken: 'directus_refresh_token'
@@ -72,6 +79,7 @@ export default defineNuxtModule<ModuleOptions>({
         {
           url: options.url,
           autoFetch: options.autoFetch,
+          autoRefresh: options.autoRefresh,
           fetchUserParams: options.fetchUserParams,
           token: options.token,
           devtools: options.devtools,
@@ -86,6 +94,7 @@ export default defineNuxtModule<ModuleOptions>({
     nuxt.options.runtimeConfig.public.directus = defu(nuxt.options.runtimeConfig.public.directus, {
       url: options.url,
       autoFetch: options.autoFetch,
+      autoRefresh: options.autoRefresh,
       fetchUserParams: options.fetchUserParams,
       token: options.token,
       devtools: options.devtools,

diff --git a/src/runtime/composables/useDirectus.ts b/src/runtime/composables/useDirectus.ts
@@ -6,7 +6,7 @@ import { useDirectusToken } from './useDirectusToken'
 export const useDirectus = () => {
   const baseURL = useDirectusUrl()
   const config = useRuntimeConfig()
-  const { token } = useDirectusToken()
+  const { token, token_expired, refreshTokens } = useDirectusToken()
 
   return async <T>(
     url: string,
@@ -15,7 +15,13 @@ export const useDirectus = () => {
   ): Promise<T> => {
     const headers: HeadersInit = {}
 
-    if (token && token.value) {
+    if (config.public.directus.autoRefresh) {
+      if (token_expired.value) {
+        await refreshTokens();
+      }
+    }
+
+    if (token?.value && !token_expired.value) {
       headers.Authorization = `Bearer ${token.value}`
     } else if (config.public.directus.token && useStaticToken) {
       headers.Authorization = `Bearer ${config.public.directus.token}`

diff --git a/src/runtime/plugin.ts b/src/runtime/plugin.ts
@@ -8,9 +8,15 @@ export default defineNuxtPlugin(async (nuxtApp) => {
 
   const config = useRuntimeConfig();
   const { fetchUser } = useDirectusAuth();
-  const { token } = useDirectusToken();
+  const { token, token_expired, refreshTokens } = useDirectusToken();
   const user = useDirectusUser();
 
+  async function checkRefreshToken() {
+    if (config.public.directus.autoRefresh) {
+      if (token_expired.value) await refreshTokens();
+    }
+  }
+
   async function checkIfUserExists() {
     if (config.public.directus.autoFetch) {
       if (!user.value && token.value) {
@@ -21,12 +27,14 @@ export default defineNuxtPlugin(async (nuxtApp) => {
 
   nuxtApp.hook('app:created', async () => {
     if (process.server) {
+      await checkRefreshToken();
       await checkIfUserExists();
     }
   })
 
   nuxtApp.hook('page:start', async () => {
     if (process.client) {
+      await checkRefreshToken();
       await checkIfUserExists();
     }
   })