javascript - Node.js 无法识别 Ajax 请求

Question

我正在尝试创建一个专用于 Ajax 请求的私有(private)页面。这是简单的请求。

window.onload = loaded;

function loaded(){
    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/data_annotations', true);
    xhr.onload = function(){
        if(this.status == 200){
            var data = xhr.responseText;
            console.log(JSON.parse(data));
        } else {
            console.log("Rip");
        }
    }
    xhr.send(); 
    //httpreq.abort();
}

这是它运行的node.js:

...
app.get('/', function(req, res, next){
    console.log("Connected Successfully.");
    res.render('home');
});

app.get('/data_annotations', function(req, res, next){
    if(req.xhr || req.headers.accept.indexOf('json') > -1) {
        const mc = mongo.MongoClient;  
        const url = 'mongodb://localhost:27017/';
        const dbName = 'practiceMDB';
        console.log("Got Data Annotations.");

        mc.connect(url, { useNewUrlParser: true }, (err, client) =>{
            if(err){
                console.log(err);
            } else {
                const db = client.db(dbName);
                data = db.collection('DataAnnotations');
                data.find({}).toArray(function(err, data){
                    res.send(data)
                });
                client.close();
            }
        });
    } else {
        res.redirect('/');
    }  
});

app.listen(port, function(){
    console.log('Server Started on Port '+port);
});

我只希望/data_annotaion 在来自 Ajax 请求时运行。如果用户在 URL 中输入/data_annotations，它应该将其重定向到主页。当我运行这个时，我得到了这些结果:

Server Started on Port 3000
Connected Successfully.
Connected Successfully.

这(对我来说)表明 ajax 请求没有注册为 ajax 请求，而是注册为普通请求。此外，我收到此错误:

Uncaught SyntaxError: Unexpected token < in JSON at position 0

我认为这是由于重定向造成的。 Ajax 请求被重定向，它获取主页的响应并且无法解析它(我相信这种情况发生是因为它无法解析 HTML 文本或字符串文本 - 不要引用我的话)。如何让 Node JS 注册我的 Ajax 请求？

PS:我查看了这个答案来确定请求是否是 Ajax，但它总是确定我的请求不是 Ajax:https://stackoverflow.com/a/28540611/6804700

Answer 1

第一件事 - 在客户端代码中，您需要设置接受 header ，因为这是您在服务器端代码中寻找的内容。

xhr.setRequestHeader("accept", "application/json");

其次，您可以使用以下代码在服务器端代码中以 json 形式返回数据

res.json(data);

另一条评论。在 API 中更改结果类型或重定向是不好的做法。您的网址要么返回 JSON，要么重定向到 HTML 页面，这意味着结果不一致。