Nuxtjs Axios in Vuex Module CORS错误-Java 学习之路

我正在使用Nuxtjs和内置的Vuex模块以及Nuxtjs的官方axios . 我正试图从我的本地服务器GET，它总是抛出CORS错误 .

所以我对Github的公共 endpoints 进行了API调用，并且仅在我的控制台中获取了CORS错误 .

我正在使用Store操作在组件创建生命周期上启动对服务器的AJAX调用 . 这是我的代码 .

// component.vue

created () {
   this.$store.dispatch('getGithubAPI')
}

// store action

  async getGithubAPI ({ commit, state }) {
    await this.$axios.$get('https://api.github.com/users/kaungmyatlwin', { headers: { 'Access-Control-Allow-Origin': '*' } })
      .then(resp => {
        console.log(resp.data)
      })
  }

得到它仍然没有运气 . 这是抛出到控制台的错误消息 .

Failed to load https://api.github.com/users/kaungmyatlwin: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:3000' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

我在这做错了什么？或者是驻留在async / await中的错误？

更新：奇怪的是网络呼叫实际上是从服务器中取出并从中获取数据，因为它可以在Chrome的网络控制台中看到 .

1 回答

1
好吧，我似乎已经找到了这个问题 .

在 nuxt.config.js 中，您必须将 credentials: false 设置为允许CORS通配符 .

我的axios配置在这里 .
```
axios: {
    baseURL: 'https://api.github.com',
    proxyHeaders: false,
    credentials: false
  }
```
参考：https://github.com/nuxt-community/axios-module#credentials
回复于 2024-04-19T15:28:51+08:00

Nuxtjs Axios in Vuex Module CORS错误

1 回答

相关问题