简体   繁体   English

重定向到登录页面而不是刷新 Nuxt auth 中的令牌

[英]Redirecting to Login page instead of refreshing the token in Nuxt auth

I implemeted the Nuxt auth module in my project.我在我的项目中实现了 Nuxt auth 模块。 Now I have 2 tokens, Access token (30 minutes maxAge) and Refresh Token (8 Hours maxAge).现在我有 2 个令牌,访问令牌(30 分钟 maxAge)和刷新令牌(8 小时 maxAge)。

What I want to achieve is refresh the Access token every 30 mins using the Refresh token.我想要实现的是使用刷新令牌每 30 分钟刷新一次访问令牌。 After 8 hours, The person should be logged out since the Refresh token got expired. 8 小时后,由于刷新令牌过期,此人应注销。

But currently the person is being redirected to the login page after the Access token is expired.但目前该人在访问令牌过期后被重定向到登录页面。 Sometimes it'll update the Access token (Only if the user is engaging in the app, If the user is idle it is redirecting to login page.)有时它会更新访问令牌(仅当用户正在使用应用程序时,如果用户处于空闲状态,它会重定向到登录页面。)

I'm using "@nuxtjs/auth-next": "5.0.0-1648802546.c9880dc" package我正在使用“@nuxtjs/auth-next”:“5.0.0-1648802546.c9880dc”package

Below is the nuxt.config.js下面是 nuxt.config.js

auth: {
    redirect: {
        login: "/",
        logout: "/",
        callback: "/dashboard",
        home: "/dashboard",
    },
    strategies: {
        local: {
            scheme: "refresh",
            token: {
                property: "tokens.access.token",
                global: true,
                type: "Bearer",
                maxAge: 60 * 30, // 30 minutes
            },
            refreshToken: {
                property: "tokens.refresh.token",
                data: "refreshToken",
                maxAge: 60 * 60 * 8 // 8 Hours
            },
            user: {
                property: "user",
                autoFetch: false,
            },
            endpoints: {
                login: { url: "/users/login", method: "post" },
                refresh: { url: "/users/refresh-tokens", method: "post" },
                user: false,
                logout: "",
            },
            autoLogout: true,
            tokenRequired: true,
            tokenType: 'JWT',
        },
    },
    plugins: [{ src: "~/plugins/axios.js", ssr: true }],
}

Below is my /plugins/axios.js file下面是我的 /plugins/axios.js 文件

export default function ({ store, app: { $axios }, route, redirect }) {
  // the two interceptors here will run in every $axios requests
  // On Request for this purpose is used to add the Bearer token on every request
  $axios.onRequest((config) => {
   let accessToken = store.state.token;
   if (accessToken && config.url !== "/users/login") {
     config.headers.Authorization = "Bearer " + accessToken;
   }
   return config;
  });

  // On Error, when there is no Bearer token or token expired it will trigger logout
  $axios.onError(async (error) => {
   // Error status code
   const statusCode = error.response ? error.response.status : -1;
   if (route.path !== "/" && statusCode === 401) {
     return redirect("/");
   }
  // return Promise.reject(error);
  });
}

Making the autoLogout: false fixed my issue.制作autoLogout: false解决了我的问题。 Now it's calling refrsh token API properly.现在它正在正确调用刷新令牌 API。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM