时间戳

首页 > 解决方案 > 进行 api 调用时，CORS 策略已阻止获取错误

javascript - 进行 api 调用时，CORS 策略已阻止获取错误

问题描述

当我尝试对kickstarter Staff pick json 端点进行 api 调用时出现以下错误

这就是错误的样子

localhost/:1从源“ http://localhost:3000 ”对“ https://www.kickstarter.com/discover/recommended?format=json ”的XMLHttpRequest 的访问已被 CORS 策略阻止：没有“访问控制” -Allow-Origin' 标头出现在请求的资源上。

我以前遇到过这个错误，但那是在我尝试进行本地 API 调用时。

我知道我可以在浏览器上启用 cors，这可能会修复错误，但我试图避免它。

任何想法或修复？

我正在使用 axios 进行 api 调用

axios.get("https://www.kickstarter.com/discover/recommended?format=json").then(response => {

[更新：]有人也可以帮助我弄清楚我们如何将它与 Promise 一起使用。

 let Base_url = axios.get(base_url)
  let StaffPick = axios.get(staffPick)


   return Promise.all(Base_url, StaffPick).then(response => {

员工选择在哪里https://www.kickstarter.com/discover/recommended?format=json 和 base_url是：http ://coincap.io/map

标签： javascriptajaxapi

解决方案

像这样尝试它，它应该可以工作：

fetch(
  'https://cors-anywhere.herokuapp.com/https://www.kickstarter.com/discover/recommended?format=json')
  .then(response => response.json())
  .then(data => console.log(data));

或者与 axios 等价的...

这是代码沙箱的现场演示：https ://codesandbox.io/s/ox7wz9ny15

我们没有编写自己的代理服务器，而是使用这个：https ://github.com/Rob--W/cors-anywhere

注意：如果您想在生产中使用它，我建议您编写自己的代理服务器...有关 CORS 的更多信息：https ://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

推荐阅读