Question

我正在尝试正确解释从对URL的提取调用的响应，我认为这是一个json字符串。我已经尝试过基于类似文章的多种变体，但是没有任何东西可以帮助我获得有用的数据。这是一种尝试：

fetch('http://serverURL/api/ready/', {method: "POST", mode: "no-cors"})
    .then(function(response) { 
        response.json().then(function(data) {
            console.log('data:' + data);
        });
    })
    .catch(function(err) {
        console.log('Fetch Error :-S', err);
    });

这将在控制台中返回语法错误：

SyntaxError：JSON.parse：第1行第1列的数据意外结束 JSON数据

所以它可能不是JSON ...如果我在console.log行上放置一个断点，并将鼠标悬停在响应（上面的行）上，则会看到响应对象（？）带有多个字段：

不确定如何解释... status：0表示它没有得到有效的响应。但是，如果我检查开发人员工具中的“网络”选项卡，然后单击“提取”行，状态为200，并且“响应”窗口/ JSON部分显示了消息信息，您也可以看到是否只是将URL放入浏览器URL直接吧。就像“响应有效负载”部分一样，该部分显示了JSON字符串：

{“ msg”：“ API就绪。”，“成功”：true}

所以...看起来像json，不是吗？但是fetch无法将其作为json吸收？

这是另一个变体，但是使用response.text（）而不是response.json（）

fetch('http://serverURL/api/ready/', {method: "POST", mode: "no-cors"})
    .then((response) => {
        console.log(response);
        response.text().then((data) => {
            console.log("data:" + data);
    });
});

这将在控制台中打印响应对象（与上面相同：确定：false，状态：0，类型：不透明等）。第二个console.log文件在data：之后不打印任何内容。如果我使用response.json，同样会收到如上所述关于数据结尾的语法错误。

有什么想法吗？我意识到服务器可能没有提供获取所需的信息，但是它确实提供了一些信息（至少在直接在浏览器中使用URL时），这就是我需要处理的信息，例如json或文本或其他信息。

Answer 1

基本上，您不能访问不透明请求中的响应正文。

添加模式：“无心”不会神奇地使事情正常进行。浏览者   默认块前端代码无法跨资源访问资源。如果   一个站点在其响应中发送Access-Control-Allow-Origin，然后   浏览器将放松该阻止，并允许您的代码访问   响应。

但是，如果网站未在其中发送Access-Control-Allow-Origin标头   它的响应，那么您的前端JavaScript代码就无法   直接访问该站点的响应。特别是指定   模式：“无心”不会解决该问题（实际上只会使情况变得更糟）。

来自https://stackoverflow.com/a/43268098/1666071

也来自fetch文档：

no-cors-防止该方法不是HEAD，GET 或POST，并且标头不是简单的标头。如果任何ServiceWorkers拦截了这些请求，则他们可能不会添加或覆盖除简单标头之外的所有标头。 此外，JavaScript可能无法访问结果的任何属性响应。。这确保ServiceWorkers不影响语义。并防止由于以下原因引起的安全和隐私问题跨域泄漏数据。

https://developer.mozilla.org/en-US/docs/Web/API/Request/mode

如何处理“不透明”类型的提取响应？

1 个答案: