Fetch：我在 DevTools 中看到了响应，但 Fetch 仍然给我一个 GET 的“Access-Control-Allow-Origin”问题

Question

所以我有一个关于fetch和Access-Control-Allow-Origin 。

我尝试获取一些这样的网站：

fetch('https://localhost/.../api/json')
    .then(blob => blob.json())
    .then(data => console.log("data:", data))
    .catch(err => console.log("err: ", err));

所以在 Chrome 网络标签中，我看到显然没有问题。 但是，在 JavaScript 代码中，我遇到了CORS问题。 这怎么可能呢？ 看：

我尝试添加mode: 'cors'它没有帮助。 我尝试添加mode: 'no-cors'是的，它通过了，但在这种情况下我无法阅读答案，我得到了Unexpected end of input无论如何'blob'变量是空的。

如果我使用Postman或Curl在没有任何选项或标题的情况下执行相同的 GET 请求，它就像一个魅力，我会得到我的回应。

你有什么主意吗？ 提前致谢

编辑：由于它正在处理Postmann和Curl并且因为我可以在 Chrome Debugger 中看到响应，我认为它不是另一个问题的重复，其中请求明确转到不允许的外部 URL从其他地方访问。 对？

Edit2：它可能必须这样做地址： https://localhost是自签名的，因此没有有效的证书？ 在curl我必须添加--insecure标志。

Answer 1

正如 TJ Crowder 所指出的，这在浏览器中是不可能做到的。 查看相关资源：

• https://en.wikipedia.org/wiki/Same-origin_policy#Security_Applications
• https://www.w3.org/TR/access-control/
• https://blogs.msdn.microsoft.com/ieinternals/2009/08/28/same-origin-policy-part-1-no-peeking/

但是，不要绝望！ 有一个解决方法：

cURL 服务器解决方法：

我们将使用调用cURL的节点服务器来绕过限制：

您将需要带有 npm 的 nodejs。

• 做npm init和npm i -S express
• 添加一个api.js文件。 使用以下代码：

    const https = require("https");
    const express = require('express');

    const app = express();

    app.use(function(req, res, next) {
        res.header("Access-Control-Allow-Origin", "*");
        res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
        next();
    });

    app.get('/', function (req, res) {
        const exec = require('child_process').exec;

        exec('curl ' + req.query.url + ' --insecure', function (error, stdout, stderr) {
          console.log('stdout: ' + stdout);
          console.log('stderr: ' + stderr);

          res.json(stdout);

          if (error !== null) {
            console.log('exec error: ' + error);
          }
        });
    });

    app.listen(3000, function () { console.log('listening on port 3000!'); });

• 通过node api.js运行服务器
• 现在，在您的代码中，您可以向localhost:3000发出请求，并在查询参数中添加要向其发出get请求的 url。 例子：

    fetch('http://localhost:3000/?url=https://HOST/.../api/json')
      .then(blob => blob.json())
      .then(data => console.log("data:", data))
      .catch(err => console.log("err: ", err));

• 请求现在按预期工作。 享受。