Question

我正在使用ReactJS编写应用程序的客户端，我一直在从某个api获取数据。我得到“No'Access-Control-Allow-Origin'标头出现在请求的资源上。因此，'http://localhost:3000'来源不允许访问”错误。我假设服务器缺少“Access-Control-Allow-Origin”标头以启用CORS，但我不明白为什么当我尝试使用“Restlet客户端 - REST API测试进行AJAX调用时“浏览器扩展它确实有效。我得到了以下成功回复。但它在我的实际反应请求中不起作用。有没有办法在服务器端没有任何变化的情况下摆脱这个错误？为什么这个扩展实际上有效？

Connection: keep-alive
Content-Type:   application/json; charset=UTF-8;
Date:   
2017 Sep 22 22:45:40-1m 50s
Server: ..../1.6.2
Transfer-Encoding:  chunked
Accept: */*
Accept-Encoding:    gzip, deflate, br
Accept-Language:    ru-RU,ru;q=0.8,en-US;q=0.6,en;q=0.4
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 
(KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36

我的React代码，但没有什么特别的，只是测试我是否收到回复

componentWillMount() {
    const url = "https://myserver.ru/api/issue?perPage=10";
    Request.get(url).then((response) => {
      this.setState({
      issues: response
     });
    });   
  }

Answer 1

如果您正在进行跨站点请求，那么浏览器将需要来自服务器的Access-Control-Allow-Origin标头。该标头的值可以是

Access-Control-Allow-Origin: *

或

Access-Control-Allow-Origin: http://localhost:3000

当您从localhost请求时，请确保它还需要添加端口号。

有关CORS文档的更多信息：

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

希望它有所帮助。

CORS的“Access-Control-Allow-Origin”标头不存在问题

1 个答案: