node.js - React Native/Node API : Can't set headers after they are sent

标签 node.js reactjs react-native cors fetch-api

我的 React Native 应用程序与 Node API 交互时遇到问题。 当我尝试通过 Node 发布数据以更新数据库中的某些值(然后转到存储过程)时,我收到 500 - 在 Node 中发送后无法设置 header

我能找到的所有信息都表明这可能是由于发送了两次响应造成的。我认为这里的情况并非如此。我已经在 postman 中进行了测试,一切正常,它返回状态 200 并返回正确的数据。

我正在尝试将数据发布到 API,如下所示:

  const myHeaders = new Headers();
  myHeaders.append('Content-Type', 'application/json');


  fetch(`http://localhost:3000/user/preferences`, {
      method: 'POST',
      headers: myHeaders,
      mode: 'cors',
      cache: 'default',
      body: JSON.stringify({
        id: '1',
        minage: this.state.minageValue,
        maxage: this.state.maxageValue
      })
  })
      .then(response => response.json())
      .then(body => console.log(body))
      .catch(err => console.log(err));

我在 API 端接收它,并将数据传递给存储过程:

function updatePreferences(req, res, next) {
    console.log(req);
    var userid = req.body[0].id;
    var minage = req.body[0].minage;
    var maxage = req.body[0].maxage;

    db.func('___spsavepreferences', [userid, minage, maxage])
        .then(function(data){
            res.status(200)
                .json({
                    status: 'success',
                    preferences: data
                });
        });
}

有什么想法吗?

编辑:

不知道这是否告诉我什么,但我已将错误消息记录到控制台:

Error: Can't set headers after they are sent.
at validateHeader (_http_outgoing.js:504:11)
at ServerResponse.setHeader (_http_outgoing.js:511:3)
at ServerResponse.header (/Users/user/Projects/Project_node/node_modules/express/lib/response.js:730:10)
POST /user/preferences 500 410.809 ms - 189
    at ServerResponse.send (/Users/user/Projects/Project_node/node_modules/express/lib/response.js:170:12)
    at done (/Users/user/Projects/Project_node/node_modules/express/lib/response.js:967:10)
    at Object.exports.renderFile (/Users/user/Projects/Project_node/node_modules/jade/lib/index.js:374:12)
    at View.exports.__express [as engine] (/Users/user/Projects/Project_node/node_modules/jade/lib/index.js:417:11)
    at View.render (/Users/user/Projects/Project_node/node_modules/express/lib/view.js:128:8)
    at tryRender (/Users/user/Projects/Project_node/node_modules/express/lib/application.js:640:10)
    at Function.render (/Users/user/Projects/Project_node/node_modules/express/lib/application.js:592:3)
    at ServerResponse.render (/Users/user/Projects/Project_node/node_modules/express/lib/response.js:971:7)
    at /Users/user/Projects/Project_node/app.js:51:7
    at Layer.handle_error (/Users/user/Projects/Project_node/node_modules/express/lib/router/layer.js:71:5)
    at trim_prefix (/Users/user/Projects/Project_node/node_modules/express/lib/router/index.js:315:13)
    at /Users/user/Projects/Project_node/node_modules/express/lib/router/index.js:284:7
    at Function.process_params (/Users/user/Projects/Project_node/node_modules/express/lib/router/index.js:335:12)

编辑 2:明白了。我需要接收 req.body.id、req.body.minage 等值,而不是 req.body[0].id。 出现这样的错误很奇怪,但解决了错误。

最佳答案

如果您在 postman 中看到不同的行为,那是因为 postman 只是直接执行POST,而浏览器则执行 CORS preflight OPTIONS request在尝试 POST 之前。

因此,听起来导致您看到的“发送后无法设置 header ”的请求是 OPTIONS 请求,而不是 POST 请求。

您可以通过使用 postman 发送 OPTIONS 请求来确认这一点,并确保还提供 Origin 请求 header 作为请求的一部分。使用 curl 你可以这样做:

curl -X OPTIONS -i -H 'Origin: http://x.y' http://localhost:3000/user/preferences

这可能会产生与您在浏览器请求中看到的相同的 500 错误。

至于如何修复它,我认为这里的其他人无法在没有看到更多服务器端代码的情况下告诉您。但归根结底似乎是,在您的代码中的某个位置,您有一个或多个位置具有处理 OPTIONS 请求的逻辑,并且在 OPTIONS 处理代码中的某个位置,它尝试在发送 header 后发送 header 。

为了追踪它的位置,您似乎想要查看服务器端的服务器日志并找到发生 500 故障时记录的任何消息。

顺便说一句,在这种情况下,触发浏览器执行 COR 预检 OPTIONS 请求的部分是 myHeaders.append('Content-Type', 'application/json') 部分。

关于node.js - React Native/Node API : Can't set headers after they are sent,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45646487/

相关文章:

node.js - 如何使用 node.js 获取图像文件的字节大小

javascript - 尝试在 React 中构建通用表单组件而不使用 eval()

reactjs - 当我单击“提交”按钮时,如何获取包含电子邮件和密码的对象

react-native - React Native 只允许 TextInput 的小写输入

javascript - P-521(Web Crypto Api)/secp521r1(NodeJS Crypto)的 ECDH 生成略有不同的共享 key

javascript - 为什么在哈巴狗的简单渲染中显示 'Cannot Get/'?

javascript - 输入错误后如何清除输入字段

android - 应用程序关闭时如何在 Android 通知中显示操作按钮?

reactjs - 如何在React Native应用程序中订阅Supabase的实时数据?

Node.js 和 MongoDB 时区问题 驱动程序未正确转换 UTC?