React JS js 中的 AJAX 请求不起作用

AJAX request in React JS js doesn't work

本文关键字：请求 不起作用 AJAX 中的 JS js React      更新时间：2023-09-26

我正在尝试通过 AJAX 请求从我的数据库中获取信息，但没有触发成功事件。

但是，服务器会收到 AJAX 请求，因为它会在终端中触发正确的控制台日志。

我正在使用Express框架在Node中构建它。

下面是触发 AJAX 调用的代码。"组件安装触发"将记录到控制台。但随后它停止了。控制台.log"成功"或"错误"都不会触发，即使我知道服务器已接收enter code here AJAX 请求。

app.get('/api/:name', function (req,res){
    name = req.params.name;
    Member.findOne({username: name}, function(err,member){
        res.setHeader('Content-Type', 'application/json');
        res.write(member.toString());
        console.log('member fetched from DB: ', member);
        res.end();
    });
});

我也没有收到任何其他错误，所以我不知道为什么这不起作用。

有人可以帮忙吗？

更新：感谢您的帮助。我现在又近了一步。我没有意识到在处理 AJAX 请求时我需要"res.end"。当我更改此设置时，我设法得到了响应，尽管这是一个错误。

她是服务器端代码：

app.get('/api/:name', function (req,res){
    name = req.params.name;
    Member.findOne({username: name}, function(err,member){
        res.setHeader('Content-Type', 'application/json');
        res.write(member.toString());
        console.log('member fetched from DB: ', member);
        res.end();
    });
});
与您的

问题无关，但与弄清楚为什么不调用.success同样重要：您的代码没有在成功处理程序中调用Main的setState，因为成功函数不是"在您的组件中"调用的，而是"通过jQuery，某处"。

如果要在组件上调用 setState 作为成功处理的一部分，请缓存组件，然后对其调用组件函数：

var self = this;
$.ajax({
  ...
  success: function() {
    self.setState({ ... });
  }
...

或者使用 JavaScript bind 函数（与 jQuery.bind 无关）显式设置成功函数的执行上下文作为您的组件：

...
success: function(data) {
  console.log('success')
  this.setState({data: data});
}.bind(this),
...

我的错误在于res.write（member.toString（））。我不得不将其更改为res.write（JSON.stringify（member）），因为客户端要求一个JSON文件。

相关文章：