对外部API的HTTP请求。NET，但不是React（CORS问题）

Question

我想向外部API发出HTTP Post请求，但当我试图从React with axios执行此操作时，我遇到了CORS错误（请求的资源上不存在“Access Control Allow Origin”头）。同时，在.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标头，API会检查标头，以决定它是否应该为您服务（通过允许浏览器继续执行主请求）。

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

所以你有两个选择：

• 从后端代理API调用
• 要求API允许来自应用程序源的请求https://$domain:$port

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

• CORS—它是客户端的东西、服务器端的东西还是传输级的东西？