为什么 CORS 不提出请求？答案

【问题标题】：Why does CORS not make a request?为什么 CORS 不提出请求？
【发布时间】：2020-05-24 20:03:28
【问题描述】：

我对 CORS 请求有疑问

Access to fetch at 'https://webhook.site/f9087e12-b444-4e6b-9e64-06ba47b8c24e' from origin 'https://localhost:5001' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

我的要求：

        fetch("https://webhook.site/f9087e12-b444-4e6b-9e64-06ba47b8c24e", {
        method: 'get',
        headers: new Headers({
            'Access-Control-Allow-Origin': 'https://localhost:5001',
            'Content-Type': 'application/json;charset=utf-8'
        }),
    })
        .then(res => res.json())
        .then(
            (result) => {
                console.log('res ' + result);
            },
            (error) => {
                console.log('error ' + error);
            }
        )

我不知道如何解决这个问题。

【问题讨论】：

您是否阅读了错误信息？它确切地告诉您原因，和一种解决方案。还有很多关于 CORS 的现有帖子和其他资源，您是否进行过任何研究？

标签： reactjs fetch

【解决方案1】：

CORS 是服务器端的东西。您的浏览器正在联系 webhook.site 并说“我想下载 f9087e12-b444-4e6b-9e64-06ba47b8c24e 那个东西，你会将它提供给哪些域？”和 webhook.site 说例如“我只会将它提供给从 whatever.com 下载的脚本”并且您的浏览器正在考虑“嗯，发出请求的脚本是从 localhost 下载的，所以..拒绝”

您需要更改 webhook.site 服务器，使其允许本地主机，而不是客户端。服务器对 OPTIONS 请求的响应必须包含 Access-Control-Allowed-Origin 标头，而不是来自客户端的请求。或者您需要在没有 CORS 的情况下发出请求，在这种情况下浏览器不会发出选项请求。

【讨论】：

你对服务器的拟人化很好地说明了你的答案，哈哈
我只是不明白，我如何发送请求。如果我写了'no-corse'，它的写入错误：SyntaxError: Unexpected end of input.
您需要编辑您的问题以向我们展示您所做的更改，或提出新问题

【解决方案2】：

CORS 标头应从服务器返回。 https://webhook.site/f9087e12-b444-4e6b-9e64-06ba47b8c24e 后面的服务器应返回标头 'Access-Control-Allow-Origin': 'https://localhost:5001' 以响应所有请求，尤其是 OPTIONS 请求（预检）。

我见过的最好的主题介绍是https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

简而言之，服务器应决定是否允许 CORS，以及允许使用哪些资源。

浏览器有责任通过遵守服务器定义的规则来保护用户。

希望对你有帮助...

【讨论】：

【解决方案3】：

这是浏览器保护其用户的方式。您的请求可能是无辜的，但想象一下这样一个场景：用户访问一个看起来很无辜的网站，然后使用 http 将用户输入的任何密码发送给小偷。所以浏览器将只允许对同一域或“源”的请求。

有很多方法可以绕过它，但普遍接受的做法是将请求发送到您的服务器 (localhost:5001)，然后您的服务器将请求发送到另一个站点并将响应发送回浏览器。

这样所有请求都会通过用户决定信任的域进行访问。

【讨论】：