Question

我在React Web应用程序中使用Fetch进行API调用（在另一个域上运行）。我收到以下错误消息。

访问地址为来自来源“ http://localhost:3000”的'-------- API URL ---------'已被CORS政策阻止：对预检请求的响应未通过访问控制检查：否请求中存在“ Access-Control-Allow-Origin”标头资源。如果不透明的响应满足您的需求，请设置请求的模式设置为“ no-cors”，以在禁用CORS的情况下获取资源。

我还阅读了关于同一问题的StackOverflow上的几个答案，题目为“ Access-Control-Allow-Origin”，但仍然不知道如何解决此问题。我不想在Chrome中使用扩展程序或使用临时破解来解决此问题。请提出解决上述问题的标准方法。

我的代码看起来像这样。

{
        return fetch('-----------API URL--------',
        {   method:'GET',
            mode: 'cors',
            headers:{
                'Access-Control-Allow-Origin':'*'
            },
        })
        .then((response) => response.json())
        .then((responseJson) => {
            console.log(responseJson.ALLORDERSRX);
            this.setState({
                isLoading: false,
                dataSource: responseJson.ALLORDERSRX,
            }, function(){

            });
        })
        .catch((error) =>{
            console.error(error);
        });

    }

Answer 1

const proxyurl = "https://cors-anywhere.herokuapp.com/";
const url = 'https://api.liveconnect.in/backend/web/erpsync/get-all-orders?data=dbCode=UAT04M%7Cidx=100%7CuserId=6214%7Cres_format=1'; // site that doesn’t send Access-Control-*
fetch(proxyurl + url).then((resp) => resp.json())
  .then(function(data) {
    console.log(data);
  })
  .catch(function(error) {
    console.log(error);
  });

从这里找到：No 'Access-Control-Allow-Origin' header is present on the requested resource—when trying to get data from a REST API

React JS-请求的资源上不存在“ Access-Control-Allow-Origin”标头。跨源资源错误

1 个答案: