205

我尝试fetch了一个旧网站的URL，并且发生了错误：

Fetch API cannot load http://xyz.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://abc' is therefore not allowed access.
If an opaque response serves your needs, set the request's mode to 'no-cors'
to fetch the resource with CORS disabled.

我理解了该消息，并尝试执行一个返回不透明响应的请求：

fetch("http://xyz", {'mode': 'no-cors'})

好的，它现在可以工作了......但我无法阅读它。=\

那么，不透明响应的目的是什么？

4

4 回答 4

167

考虑服务工作者充当不可知缓存的情况。您唯一的目标是提供与您从网络获得的资源相同的资源，但速度更快。当然，您不能确保所有资源都属于您的来源（例如，考虑从 CDN 提供的库）。由于 service worker 有可能改变网络响应，你需要保证你对响应的内容不感兴趣，也不关心它的头部，甚至不关心结果。您只对作为黑盒的响应感兴趣，以便可能缓存它并更快地提供它。

这就是{ mode: 'no-cors' }为之而生的。

于 2016-03-30T08:26:33.430 回答
76

JavaScript 无法访问不透明的响应，但您仍然可以使用Cache APIfetch缓存它们，并在服务工作者的事件处理程序中使用它们进行响应。因此，它们对于使您的应用程序脱机很有用，也适用于您无法控制的资源（例如，CDN 上未设置 CORS 标头的资源）。

于 2016-03-29T20:08:59.940 回答
1

Node JS应用程序也有解决方案。CORS Anywhere 是一个 NodeJS 代理，它将 CORS 标头添加到代理请求中。

代理的 url 从字面上取自路径，经过验证和代理。代理 URI 的协议部分是可选的，默认为“http”。如果指定端口 443，则协议默认为“https”。

除了 cookie 之外，此包对 http 方法或标头没有任何限制。不允许请求用户凭据。该应用程序可以配置为需要一个标头来代理请求，例如避免来自浏览器的直接访问。https://robwu.nl/cors-anywhere.html

于 2017-11-30T22:07:36.607 回答
-6

javascript 得到答案有点棘手，我通过从后端获取 api 然后将其调用到前端来修复它。

public function get_typechange () {

    $ url = "https://........";
    $ json = file_get_contents ($url);
    $ data = json_decode ($ json, true);
    $ resp = json_encode ($data);
    $ error = json_last_error_msg ();
    return $ resp;

}
于 2020-03-27T17:02:07.690 回答