Access-Control-Allow Origin Nuxt 获取答案

【问题标题】：Access-Control-Allow Origin Nuxt fetchAccess-Control-Allow Origin Nuxt 获取
【发布时间】：2022-09-27 21:28:28
【问题描述】：

我目前在我的 Nuxt 应用程序中使用 Reddit API 和 $fetch。效果很好，运行良好。除了 - 在 Safari 上加载它在部署到 Vercel 上的 https 域时会导致以下错误。

https://api.reddit.com/r/funny/hot.json?raw_json=1&limit=50 （加载资源失败：Origin https://xxxx.com is not allowed by 访问控制允许来源）

和。

https://api.reddit.com/r/funny/hot.json?raw_json=1&limit=50 由于失败访问控制检查。

我正在查看 CORS 问题，但我不确定为什么它可以在 MacOS Chrome 和 Safari、Android 手机上运行，而不是在 iOS Safari 和 Chrome 上运行？

https://xxxx.com 是您调用 API 的地址，对吗？可能会对这些进行一些额外的检查。也许检查一下：stackoverflow.com/q/46454208/8816585
是的，这是调用 reddit api 的网址。我真的不确定为什么只是 iOS 导致了这个问题。
看起来它需要一些标题？ - 检查所有请求都是https - 检查端点在 MacOS 和 Android 上工作 - 仅在 iOS Chrome 和 Safari 上出现错误。
也许额外的更安全/专有检查。不要对 Apple 感到好奇，他们有时也有自己的东西。 HTTPS 不是这里的问题，尝试查看在链接问题中提供更多标题是否有帮助。
@kissu 谢谢。如何使用 $fetch axios 为所有请求添加更多标头

标签： vue.js nuxt.js vercel

【解决方案1】：

我设法通过在 Nuxt Axios 中创建 proxy 来解决此问题，如下所示：

axios: {
  baseUrl: '/api',
  proxy: true
},
proxy: {
  "/api/": {
    target: "https://api.reddit.com/",
    pathRewrite: { "^/api/": "" }
  }
},

直到今天，我都不确定到底发生了什么。但是代理似乎让 Safari 和 FireFox 很高兴。

【讨论】：

这是explained here 的一种解决方法，但很高兴您至少可以使用它。