即使请求成功，fetch 的响应也是空的

Question

我正在尝试使用 fetch 函数在客户端 Javascript 代码中从服务器检索数据。我在 Chrome 中使用名为 whatwg-fetch 的 polyfill 版本的 fetch（内部支持 fetch）。

这是我调用函数的方式：

//Called in a page loaded as http://localhost:3236/
fetch("http://localhost:8080/list", {
         mode: 'no-cors',
         credentials: "include", 
    })
    .then(function(response) {
        return response.json();
    });

如您所见，我的应用程序服务器与资源服务器不同，因此我必须为 CORS 设置选项。问题是response 没有内容：

{
    body: null,
    bodyUsed: false,
    headers: Headers,
    ok: false,
    status: 0,
    statusText: "",
    type: "opaque",
    url: "",
}

当我转到网络面板并找到发送的请求时，似乎一切正常，状态为 200 和请求的数据。

我怎样才能找到问题所在？

Answer 1

线索在opaque 键中。请求成功，但 Chrome 的 CORS 限制阻止您使用返回的数据。 no-cors 选项是可疑的；如果您的服务器为跨域请求正确配置，则不需要。

注意如果您已正确配置所有内容，但在本地测试客户端时遇到错误，则使用 --disable-web-security 标志启动 Chrome 可能就足够了。