对外部 API 的 HTTP 请求适用于 .NET，但不适用于 React（CORS 问题）

Question

我想向外部 API 发出 HTTP Post 请求，但是当我尝试使用 axios 从 React 执行此操作时，我遇到了 CORS 错误（否 'Access-Control-Allow-Origin' header 出现在请求的资源上）。同时，在 .NET 中发出此请求时，一切似乎都正常。我不知道为什么它会这样工作，所以也许有人能弄明白。

响应请求：

var bodyFormData = new FormData();
    bodyFormData.append('key', 'apiKey');
    bodyFormData.append('function', 'getTeams');

    async function fetchData() {
        await axios({
            url: 'https://external.api/api/',
            method: 'POST',
            data: bodyFormData,
            withCredentials: true,
            headers: {
                'Content-Type': 'multipart/form-data',
                'Access-Control-Allow-Origin': '*',
                'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE,PATCH,OPTIONS',
                'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept'
            },
        })
            .then((response) => {
                console.log(response)
            })
            .catch((err) => {
                console.log(err)
            });
    }
    fetchData();

.NET 请求：

var request = (HttpWebRequest)WebRequest.Create("https://external.api/api/");

        var postData = "key=apiKey";
        postData += "&function=getTeams";
        var data = Encoding.ASCII.GetBytes(postData);

        request.Method = "POST";
        request.ContentType = "application/x-www-form-urlencoded";
        request.ContentLength = data.Length;

        using (var stream = request.GetRequestStream())
        {
            stream.Write(data, 0, data.Length);
        }

        var response = (HttpWebResponse)request.GetResponse();

        var responseString = new StreamReader(response.GetResponseStream()).ReadToEnd();

Answer 1

CORS 是一种仅适用于客户端（浏览器）的安全措施。无论您是否需要，浏览器都会发送 Origin header，然后 API 会检查它是否应该为您服务（通过允许浏览器继续执行主请求）。

您可以毫无问题地从后端发送请求，因为没有 Origin header 可言。

所以你有两个选择：

代理来自后端的 API 调用
请求 API 允许来自应用源 https://$domain:$port 的请求。

如果 API 在您的控制之下，这应该很容易，否则，代理是一个更直接的解决方案。

对外部 API 的 HTTP 请求适用于 .NET，但不适用于 React（CORS 问题）

HTTP Request to external API works with .NET, but not with React (CORS problems)

.net

post

http

reactjs

参考资料