Question

我正在尝试访问连接到好友系统API的数据。我使用邮递员生成请求，然后将其复制到代码中。我希望能够访问其他对象的字段

我尝试为chrome安装cors扩展程序。

这是我在脚本中发出请求的方式。

   var request = new XMLHttpRequest()

   request.open('GET','http://controlforestal.pablocanales.info/api/trozos?total=100&limit=100&offset=0&search=&status=&codigoOrigen=&largo=&diametro=&order-by=codigo&order-dir=desc&token=****', true)
request.onload = function() {
  // Begin accessing JSON data here
  var data = JSON.parse(this.response)
  if (request.status >= 200 && request.status < 400) {
data.forEach(trozo => {
  const card = document.createElement('div')
  card.setAttribute('class', 'card')

  const h1 = document.createElement('h1')
  h1.textContent = trozo.codigo

  container.appendChild(card)
  card.appendChild(h1)
})
  } else {
const errorMessage = document.createElement('marquee')
errorMessage.textContent = `error`
app.appendChild(errorMessage)
  }
}

request.send()

这是控制台向我显示的错误。

CORS策略已阻止从源“ null”访问“ http://controlforestal.pablocanales.info/api/trozos?total=100&limit=100&offset=0&search=&status=&codigoOrigen=&largo=&diametro=&order-by=codigo&order-dir=desc&token= ****”处的XMLHttpRequest：请求的资源上没有“ Access-Control-Allow-Origin”标头。

标题是

HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Content-Type: application/json
X-Powered-By: PHP/5.5.9-1ubuntu4.21
Cache-Control: no-cache
Date: Thu, 12 Sep 2019 23:47:39 GMT
X-Frame-Options: SAMEORIGIN

Answer 1

根据要使用的服务器，必须在服务器代码中启用cors。这允许您的服务器（在这种情况下，我假设为localhost）向第三方API库（在这种情况下为controlforestal）发出API请求。有关更多详细信息，请参阅CORS文档。 https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

您可以在下面找到使用XMLHttpRequest的CORS的实现： https://www.html5rocks.com/en/tutorials/cors/

根据使用CORS的项目的不同，您还可以在https://cors-anywhere.herokuapp.com/YOUR_API_URL_GOES_HERE之前添加api请求，它应该为您完成工作。

为什么我对API的请求给了我这个错误

1 个答案: