FETCH API 返回 [object Object]答案

【问题标题】：FETCH API returning [object Object]FETCH API 返回 [object Object]
【发布时间】：2015-07-16 11:56:56
【问题描述】：

我正在使用 FETCH API 来获取存储在 json 文件中的值。该值必须放入变量中。

问题是 - 变量最终将 [object Object] 作为值。

var title = fetch('URL/out.json', {mode: 'cors'});

在托管json文件的服务器的htaccess中，有一行

  Header set Access-Control-Allow-Origin "*"

json如下

 {
   lollol
}

我认为 json 可能是罪魁祸首。

我找不到 [object Object] 成为变量值的原因。

我可以使用 Fetch 获取托管文本文件吗？我试过 - 无法让它工作。 - 只是想一个替代方案。

【问题讨论】：

实际上它应该返回[object Promise]，除非你使用的是polyfill。

标签： javascript html json fetch-api

【解决方案1】：

您需要对对象进行字符串化以将其转换为 JSON 字符串。

试试JSON.stringify(theObject)

【讨论】：

字符串化输出 {"type":"text/html","size":4}

【解决方案2】：

按照here 的描述尝试使用.then()：

fetch('URL/out.json', {mode: 'cors'}).then(function(response) {
    return response.blob();
}).then(function(response) {
    // process response
});

【讨论】：

我现在的响应是 [object Blob]。
@CodyRaspien 你在第二个 then() 中添加标题，而不仅仅是完整的响应？
var title = fetch('URL/out.json', {mode: 'cors'}).then(function(response) { return response.blob(); }).then(function (响应) { response.toString; });仍然得到 [object blob]
@CodyRaspien 试试var title; [...].then(function(response) { title = response.toString; });
标题现在包含“未定义”。

【解决方案3】：

fetch API 非常面向承诺 fetch 返回一个带有响应对象作为参数的承诺然后你需要在响应上调用一个方法来给你另一个带有结果的承诺

这是我做的一个例子。在第一个 .then() 上，我在响应中调用了 .json，所以我可以在下一个 .then() 上得到我的结果

export function newVideoAsync(videoData, url) {
  return (dispatch) => {
    return fetch(url, {
      method: 'POST',
      headers: {
        'content-type': 'application/json'
      },
      body: JSON.stringify(videoData)
    })
    .then(response => response.json())
    .then(jsonData => {
      dispatch(videoSuccess(jsonData))
      console.log(jsonData);
      // find video id to redirect to that video
      // client side redirect to '/video/:id'
      browserHistory.push('/')
    })
    .catch(err => dispatch(videoError(err.message)));
  };
};

https://davidwalsh.name/fetch

【讨论】：

【解决方案4】：

对于在遵循正确的fetch 语法时仍然遇到此问题的任何人，请尝试执行以下步骤（在拔掉头发之前 :)）：

从您的项目中清除缓存
删除并重新安装外部库/模块
重新启动您的项目

【讨论】：

【解决方案5】：

这很好用

var myRequest = new Request('URL');
var title;
fetch(myRequest).then(function(response) {
    return response.text().then(function(text) {
        title= text; 
        alert (title);
    });
});

【讨论】：

很确定这会抛出一个ReferenceError，因为response 是未定义的。