Nuxt Authentication API 调用策略

Question

我正在构建的当前应用中有一些不熟悉的 API 调用。它需要几个参数来设置以下 api。目前基于窗口中的子域，它获取 url 参数来创建第一个 API 调用。之后我使用 Vuex store 来存储组织数据的相关信息。

我目前正在尝试设置授权，但不幸的是，由于它位于 nuxt.config.js 内，我无法从 vuex 存储中动态添加数据。这是我设置的策略的示例。我目前正在使用本地默认策略，但不想让 url 请求动态：

nuxt.config.js

 /*
   ** Nuxt.js modules
   */
  modules: ['@nuxtjs/axios', '@nuxtjs/auth'],
  /*
   ** Axios configuration
   */
  axios: {
    baseURL: 'https://api.getconflux.com',
    headers: {
      common: {
        Accept: 'application/json, text/plain, */*'
      }
    }
  },
  /*
   ** Auth configuration
   */
  auth: {
    strategies: {
      local: {
        endpoints: {
          login: {
            method: 'post',
            propertyName: 'token'
          },
          logout: {
            url: '/logout',
            method: 'post'
          },
          user: {
            url: '/supporters/me',
            headers: {
              'organization-id': getters.companyId,
              // Authorization Bearer needs to be automatically called from login
            },
            method: 'get',
            propertyName: 'voter'
          },
        }
      }
    },
    customStrategy: {
      user: '~/schemas/user'
    },
    redirect: {
      home: '/'
    }
  }

我手动设置的当前登录名，在我的索引页面加载时没有我称之为的 url。这是第一次使用所需数据构建状态的 api 调用，之后我需要为后续的 api 调用调用。

为了使我的身份验证 api 请求正常工作，尤其是 user 策略中的 fetchUser() 调用，我需要从我的商店获取 companyId getter/state。我不知道如何在这里执行此操作？

有没有人知道我如何才能最好地实现它？

任何帮助将不胜感激！

提前致谢！

Answer 1

您可以在 nuxt.config.js 文件中禁用用户端点，然后在 Vuex 中手动调用该端点以获取用户详细信息，然后将其传递给 auth NuxtJS 模块的 setUser 方法。所以在你的nuxt.config.js 文件中，你应该有这个：

/*
   ** Nuxt.js modules
   */
  modules: ['@nuxtjs/axios', '@nuxtjs/auth'],
  /*
   ** Axios configuration
   */
  axios: {
    baseURL: 'https://api.getconflux.com',
    headers: {
      common: {
        Accept: 'application/json, text/plain, */*'
      }
    }
  },
  /*
   ** Auth configuration
   */
  auth: {
    strategies: {
      local: {
        endpoints: {
          login: {
            method: 'post',
            propertyName: 'token'
          },
          logout: {
            url: '/logout',
            method: 'post'
          },
          user: false
    },
    customStrategy: {
      user: '~/schemas/user'
    },
    redirect: {
      home: '/'
    }
  }

然后在您的商店中，您有一个操作（或一个突变，发出 API 请求以获取用户详细信息）。然后按照here 的描述调用setUser