Javascript Node.js不';无法识别Ajax请求
我试图创建一个专用于Ajax请求的私有页面。这是一个简单的请求Javascript Node.js不';无法识别Ajax请求,javascript,node.js,ajax,express,Javascript,Node.js,Ajax,Express,我试图创建一个专用于Ajax请求的私有页面。这是一个简单的请求 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.re
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);
});
我只希望在来自Ajax请求的情况下运行/data\u注释。如果用户在url中键入/data_注释,则应将其重定向到主页。当我运行此程序时,我得到了以下结果:
Server Started on Port 3000
Connected Successfully.
Connected Successfully.
这表明(对我来说)ajax请求没有注册为ajax请求,而是注册为普通请求。此外,我得到了以下错误:
Uncaught SyntaxError: Unexpected token < in JSON at position 0
Uncaught SyntaxError:JSON中位置0处的意外标记<
我相信这是由于重定向。Ajax请求被重定向,它接收主页的响应,并且无法解析它(我认为这是因为它无法解析HTML文本或字符串文本,请不要引用我的话)。如何让NodeJS注册我的Ajax请求
PS:我查看这个答案是为了确定一个请求是否是Ajax,但它总是确定我的请求不是Ajax:首先-在客户端代码中,您需要设置accept标头,因为这是您在服务器端代码中要找的
xhr.setRequestHeader("accept", "application/json");
其次,可以使用以下代码在服务器端代码中将数据作为json返回
res.json(data);
另一个评论。在API中更改结果类型或重定向是错误的做法。您的url要么返回JSON,要么重定向到和HTML页面,这意味着结果不一致。首先,在客户端代码中,您需要设置accept标头,因为这正是您在服务器端代码中寻找的
xhr.setRequestHeader("accept", "application/json");
其次,可以使用以下代码在服务器端代码中将数据作为json返回
res.json(data);
另一个评论。在API中更改结果类型或重定向是错误的做法。您的url要么返回JSON,要么重定向到和HTML页面,这意味着结果不一致。您怎么会认为
res.send(data)
正在发送JSON?您的客户端需要JSONJSON.parse(data)
-如果不发送JSON,您将在此处收到错误。。。和req.headers.accept.indexOf('json')
。。。请求头是否包含一个带有4个字符的acceptjson
?@JaromandaX抱歉,我对使用Ajax和json还不太熟悉。。。检查浏览器开发人员工具控制台。您应该能够准确地看到请求和响应的外观,包括标题-提示:Accept
可能是*/*
,如果您不想将内容提供给普通的浏览器URL,我建议您使用自定义标题。@JaromandaX它说它来自主页(这是真的),但是Ajax请求被发送到/data\u annotations
是什么让您认为res.send(data)
正在发送JSON?您的客户端需要JSONJSON.parse(data)
-如果不发送JSON,您将在此处收到错误。。。和req.headers.accept.indexOf('json')
。。。请求头是否包含一个带有4个字符的acceptjson
?@JaromandaX抱歉,我对使用Ajax和json还不太熟悉。。。检查浏览器开发人员工具控制台。您应该能够准确地看到请求和响应的外观,包括标题-提示:Accept
可能是*/*
,如果您不想将内容提供给普通的浏览器URL,我建议您使用自定义标题。@JaromandaX它说它来自主页(这是真的),但是Ajax请求被发送到/data\u annotations
我不习惯表达JS语法。我试着像使用MVC一样使用它(我听说是这样的),一旦你了解了非阻塞I/O和回调,它和MVC是一样的。只是需要一些时间来适应。您将一直使用的库是异步库-。它将使您的代码更简单、更可靠readable@RedJandal-使用承诺编程并将其用于异步流控制和协调比使用异步库进行简单回调要好得多。承诺和async/await
是Javascript中几乎所有异步开发的未来。见鬼,node.js v10甚至有一个fs
库的预期版本。我会看看。@jfriend00-我完全同意。我只是根据用户的示例和当前体验推荐,在这个阶段没有增加更多的复杂性。我不习惯表达JS语法。我试着像使用MVC一样使用它(我听说是这样的),一旦你了解了非阻塞I/O和回调,它和MVC是一样的。只是需要一些时间来适应。您将一直使用的库是异步库-。它将使您的代码更简单、更可靠readable@RedJandal-使用承诺编程并将其用于异步流控制和协调比使用异步库进行简单回调要好得多。承诺和async/await
是Javascript中几乎所有异步开发的未来。见鬼,node.js v10甚至有一个fs
库的预期版本。我会看看。@jfriend00-我完全同意。我只是根据用户的示例和当前体验提出建议,在这个阶段没有增加更多的复杂性。