如何在.onRequest拦截器中使用axios helper setToken

Posted 2023-02-22

【中文标题】如何在.onRequest拦截器中使用axios helper setToken

【英文标题】：how to use axios helper setToken inside .onRequest interceptor

【发布时间】：2020-09-27 12:19:15

【问题描述】：

我同时使用nuxt-auth 和nuxt-axios 模块。 我想拦截每个 axios 请求并检查我的 JWT 访问令牌是否几乎过期，如果是，我想更新它。 我为 nuxt-auth 写了一个小扩展，如下所示。我的问题是，一旦我获得了新的令牌，$auth.setToken(strategy,newToken) 和$axios.setToken(newToken) 似乎并没有进行预期的更新。 那么我应该如何使用拦截器和助手呢？我不确定这是使用它们的正确位置/方式

var jwtDecode = require("jwt-decode")

export default function($auth, $axios) 
  const strategy = "local"

  $axios.onRequest( async(config) => 
    if ($auth.loggedIn) 
      let refreshToken = "some confidtion"

      if (refreshToken) 
        try 
          await refreshAccessURL()
         catch (error) 
          return Promise.reject(error)
        
      
    
    return config
  )

  async function refreshAccessURL() 
    const refresh = $auth.getRefreshToken(strategy)
    try 
      const  access  = await $axios.$post(refreshURL,  refresh )
      const newToken = "Bearer " + access
      $auth.setToken(strategy, newToken)
      $axios.setToken(newToken)

      return newToken

     catch (e) 
      $auth.logout()
      throw new Error(e)
    
  

【参考方案1】：

您可以在plugins/axios.js 中添加如下拦截器

export default function( $axios ) 
  $axios.onRequest((config) => 
     config.headers['Authorization'] = `Bearer abc`;
  );

【讨论】：

我实际上希望 auth 在我的拦截器中可用（这就是为什么我为 nuxt-auth 而不是 axios 制作了一个插件。顺便问一下，有什么区别使用config.headers['Authorization'] = 'Bearer abc' 或$axios.setToken(newToken) ?

如果您看到setToken (axios.nuxtjs.org/helpers.html#settoken) 的文档，它在内部会执行与headers['Authorization'] = 'Bearer abc' 相同的操作当我尝试使用setToken 时，由于一些内部错误，我也没有成功nuxt/axios