fetch（）输入意外结束

Question

我使用fetch()从api服务器获取数据。我的错误是这样的:

Uncaught (in promise) SyntaxError: Unexpected end of input at 
  fetch.then.blob.

你能告诉我我做错了什么吗。

const weatherAPi ='https://www.metaweather.com/api/location/523920';
fetch(weatherAPi, {
  mode: 'no-cors'
}).then(blob => blob.json())
  .then(data => console.log(data))

Answer 1

很多好的回答，但我选择了这个：

      const response = await fetch(url, {
        method: 'GET',
        headers: {
          Authorization: 'Bearer ' + accessToken
        }
      });
      const string = await response.text();
      const json = string === "" ? {} : JSON.parse(string);
      return json;

Answer 2

我遇到了同样的问题。在我的情况下，它不是由解决方案所指出的“不透明”响应类型引起的。此代码会导致空响应的错误，因为'fetch'不接受具有空正文的响应：

return fetch(urlToUser, parameters)
.then(response => {
  return response.json()
})
.then((data) => {
  resolve(data)
})
.catch((error) => {
  reject(error)
})

相反，在我的情况下，这更有效：

return fetch(urlToUser, parameters)
.then(response => {
  return response.text()
})
.then((data) => {
  resolve(data ? JSON.parse(data) : {})
})
.catch((error) => {
  reject(error)
})

即使正文为空，获取文本也不会产生错误。然后检查数据是否存在并解析。我希望这有帮助：-）

Answer 3

对跨来源资源的< code>no-cors请求的响应具有“不透明”响应类型。如果您在尝试将响应转换为JSON之前记录响应，您将看到一种“不透明”的类型。

不透明类型被列为“严格限制”，如 whatwg.org 上的获取规范中所述。

不透明过滤响应是类型为“不透明”的过滤响应，url列表为空列表，状态为0，状态消息为空字节序列，标题列表为空，正文为空，尾部为空。

正如谷歌文档中对不透明字体的解释，当字体不透明时，它们当前不能被读取。

不透明响应是对不同来源的资源发出的请求，它不返回CORS头。对于不透明的响应，我们将无法读取返回的数据或查看请求的状态，这意味着我们无法检查请求是否成功。使用当前的fetch()实现，不可能从窗口全局范围请求不同来源的资源。

这可以是依赖于环境的，也可以是依赖于语言的。例如，您可以通过更改服务器配置来更改Nginx环境中的CORS设置，也可以在应用html" target="_blank">程序代码（例如PHP）中指定标头。

我强烈推荐阅读Mozilla文档中关于CORS请求和访问控制允许起源的内容。

PHP中的一个示例：

<?php
header("Access-Control-Allow-Origin: *");  // "*" could also be a site such as http://www.example.com