fetch 给出一个空的响应主体

2024-02-21

我有一个 React/Redux 应用程序,我正在尝试向服务器发出一个简单的 GET 请求:

fetch('http://example.com/api/node', {
  mode: "no-cors",
  method: "GET",
  headers: {
    "Accept": "application/json"
  }
}).then((response) => {
  console.log(response.body); // null
  return dispatch({
    type: "GET_CALL",
    response: response
  });
})
.catch(error => { console.log('request failed', error); });

问题是响应正文为空.then()功能,我不知道为什么。我在线检查了示例,看起来我的代码应该可以工作,所以我显然在这里遗漏了一些东西。 问题是,如果我检查 Chrome 开发工具中的网络选项卡,就会发出请求并且收到我要查找的数据。

有人能照亮这个吗?

EDIT:

我尝试转换响应。

using .text():

fetch('http://example.com/api/node', {
  mode: "no-cors",
  method: "GET",
  headers: {
    "Accept": "application/json"
  }
})
.then(response => response.text())
.then((response) => {
  console.log(response); // returns empty string
  return dispatch({
    type: "GET_CALL",
    response: response
  });
})
.catch(error => { console.log('request failed', error); });

.json():

fetch('http://example.com/api/node', {
  mode: "no-cors",
  method: "GET",
  headers: {
    "Accept": "application/json"
  }
})
.then(response => response.json())
.then((response) => {
  console.log(response.body);
  return dispatch({
    type: "GET_CALL",
    response: response.body
  });
})
.catch(error => { console.log('request failed', error); }); // Syntax error: unexpected end of input

查看chrome开发工具:


我刚刚遇到了这个。正如本文中提到的answer https://stackoverflow.com/a/35291777/2800482, using mode: "no-cors"会给你一个opaque response,它似乎没有返回正文中的数据。

opaque:对跨源资源的“no-cors”请求的响应。严格限制 https://fetch.spec.whatwg.org/#concept-filtered-response-opaque.

就我而言,我正在使用Express。我安装后Express 的 cors https://github.com/expressjs/cors并配置它并删除mode: "no-cors",我得到了回报。响应数据将在承诺中,例如

fetch('http://example.com/api/node', {
  // mode: 'no-cors',
  method: 'GET',
  headers: {
    Accept: 'application/json',
  },
},
).then(response => {
  if (response.ok) {
    response.json().then(json => {
      console.log(json);
    });
  }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

fetch 给出一个空的响应主体 的相关文章

随机推荐

  • 如何正确编写 Swift UI Toggle 的 UI 测试

    有谁知道如何正确编写 Toggle 的 UI 测试 即使在一个全新的项目中 整个 UI 中只有一个切换而没有其他内容 我仍然会收到此类错误 Failed to get matching snapshot Multiple matching
  • OpenCV detectorMultiScale() 参数的推荐值

    推荐的参数是什么CascadeClassifier detectMultiScale http docs opencv org modules objdetect doc cascade classification html cascad
  • 如何在 Node.js 中将 JPG 图像转换为 WEBP 格式?

    我正在尝试使用react Js上传图像并使用multer中间件将该图像保存在node Js中 这是完美的 但现在我想使用 webp converter 将该图像转换为 WEBP 格式 反之亦然 但我收到此错误 Error Command f
  • JavaScript 数字到单词

    例如 我正在尝试将数字转换为英语单词1234会成为 一千二百三十四 我的策略是这样的 将数字分成三位并将它们放入数组 finlOutPut 从右到左 转换每个组 每个单元格中finlOutPut数组 的三个数字到一个单词 这就是triCon
  • 使用 PHP、活动目录以及 IE/Firefox 对 ldap 进行身份验证

    下面的代码根据 ldap 检查用户的凭据
  • Tensorflow 不会在 CUDA 支持下构建

    我已经尝试从源代码构建张量流 如安装指南 https www tensorflow org install install sources 我已经成功地使用仅 cpu 支持和 SIMD 指令集构建了它 但在尝试使用 CUDA 支持构建时遇到
  • 在 ARM/Thumb (IOS) 上解码 BLX 指令

    我已经阅读了大部分 ARM 文档 但在解码 BLX 指令时仍然遇到问题 下面是两个例子 text 0000347C 02 F0 B2 ED BLX objc msgSend text 0000469C 01 F0 A2 EC BLX obj
  • 允许机器人访问 Telegram Group 消息[重复]

    这个问题在这里已经有答案了 比之前更进了一步如何将机器人添加到 Telegram 群组 https stackoverflow com questions 37338101 如何以管理员身份将机器人添加到 Telegram 群组 我已将我的
  • “strcpy”和“strcpy_s”之间的区别?

    当我尝试使用时strcpy复制字符串给了我一个编译错误 error C4996 strcpy This function or variable may be unsafe Consider using strcpy s instead T
  • 将数组的元素向左旋转

    我正在尝试解决来自的 JavaScript 挑战杰希罗网 挑战是这样的 编写一个旋转函数来旋转数组的元素 全部 元素应向左移动一位 第 0 个元素 应该放在数组的末尾 旋转后的数组应该是 回 旋转 a b c 应该返回 b c a 我能想到
  • 使用 HDF5 进行大型数组存储(而不是平面二进制文件)是否具有分析速度或内存使用优势?

    我正在处理大型 3D 数组 我经常需要以各种方式对其进行切片以进行各种数据分析 典型的 立方体 可以约为 100GB 并且将来可能会变得更大 看来Python中大型数据集的典型推荐文件格式是使用HDF5 h5py或pytables 我的问题
  • 使用 Visual Studio 2010 Express 将 .doc 保存/转换为 .html

    我有一个 Word 文档文件夹 我想将其转换为 html 以便进一步处理 我只有 Visual Studio 2010 Express 版本 可以使用 Express 版本吗 我找到了如何进行转换的示例 但它们需要 Microsoft Of
  • 如何反转 Julia 中的字典?

    如果我有一本字典 比如 my dict Dict A gt one B gt two C gt three 反转键 值映射的最佳方法是什么 一种方法是使用推导式通过迭代键 值对并一路交换它们来构建新字典 julia gt Dict valu
  • Qt 和 QMake 构建目录

    我想从源代码树中构建 qt 和 qt 应用程序 你知道如何使用configure和qmake从命令行设置 obj目录吗 如果我正确理解问题你应该设置对象目录 http qt nokia com doc 4 5 qmake variable
  • 替换delphi中的组件类

    我知道我在某个地方看到过一个 hack 的例子 用于定义现有 VCL 组件的自定义版本 例如TButton or TEdit 具有相同的类名 并执行一些操作 以便 DFM Streamer 实例化您的版本而不是原始版本 不幸的是 我所处的情
  • Express-session 未在浏览器中设置 cookie

    所以我正在使用express session设置 cookie 和 session 的包 它还连接到我的 MongoDB 存储来存储会话 当用户登录时 会话会很好地存储在数据库中 但是浏览器中没有cookie 我的应用程序正在运行http
  • 如何检查下拉菜单是否被禁用?

    使用 jquery 如何简单地检查它是否是只读的 这就是我正在尝试的 item keydown function event alert event keyCode if event keyCode 13 ok click if dropL
  • 获取内容:找不到路径

    我正在尝试在 PowerShell 中编写一个脚本 该脚本在 foreach 循环中读取名称中包含 example 的特定文件夹中的所有唯一文件 问题是我试图将每个文件的内容保存在变量中但没有成功 尝试使用获取内容 file它会抛出以下错误
  • 从 PHP 创建 MySQL 用户和数据库

    有没有办法使用 PHP 创建一个新的 MySQL 数据库 一个新的 MySQL 用户并授予新用户对新数据库的权限 EDIT 应该指出 这是从一台服务器运行到另一台服务器 因此服务器 A 尝试在服务器 B 上安装数据库 用户 我有这个 con
  • fetch 给出一个空的响应主体

    我有一个 React Redux 应用程序 我正在尝试向服务器发出一个简单的 GET 请求 fetch http example com api node mode no cors method GET headers Accept app