Javascript Ajax调用另一个Node.js服务器?
我没有具体的问题,但我需要解释一下。我正在做一项任务,要求在页面加载后使用AJAX(不带JQuery)显示列表。然而,我对部分说明感到困惑 “…以显示。页面加载后,Ajax调用应调用Node.js服务器以检索前10名列表。。然后列表必须以编号列表的形式显示给用户。项目…” 这是否意味着我需要在已经创建的Node.js服务器之外再创建一个Node.js服务器,或者这一切都可以在一个服务器中完成?我对这部分很困惑 这是我的Node.js服务器Javascript Ajax调用另一个Node.js服务器?,javascript,node.js,express,pug,Javascript,Node.js,Express,Pug,我没有具体的问题,但我需要解释一下。我正在做一项任务,要求在页面加载后使用AJAX(不带JQuery)显示列表。然而,我对部分说明感到困惑 “…以显示。页面加载后,Ajax调用应调用Node.js服务器以检索前10名列表。。然后列表必须以编号列表的形式显示给用户。项目…” 这是否意味着我需要在已经创建的Node.js服务器之外再创建一个Node.js服务器,或者这一切都可以在一个服务器中完成?我对这部分很困惑 这是我的Node.js服务器 'use strict'; const express
'use strict';
const express = require('express'),
request = require('request'),
app = express();
app.set('view engine', 'pug');
app.set('views', './views');
app.use(express.json());
app.use(express.urlencoded({
extended: true
}));
app.use(express.static('public'));
app.get('/', function (req, res) {
res.render('index');
});
app.listen(3000, function () {
console.log('Listening on http://localhost:3000');
});
app.get('/data', function (req, res) {
res.json({"list": ["item1", "item2"]});
});
这是我的哈巴狗模板
doctype
html
head
meta(charset="UTF-8")
meta(name="viewport", content="width=device-width, initial-scale=1")
block title
title This is the title!
link(rel='stylesheet', href='/css/style.css', type='text/css')
body
h1 This is a header!
div#banner
p#demo This is a description!
script(src='/js/mrvl_ajax.js')
这是我的AJAX调用函数
'use strict';
window.addEventListener("load", function(event) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
document.getElementById("demo").innerHTML = this.responseText;
};
xhttp.open("GET", "**Server Location?**", true);
xhttp.send();
});
您可以在Node.js服务器上创建另一个端点
'use strict';
const express = require('express'),
request = require('request'),
app = express();
app.set('view engine', 'pug');
app.set('views', './views');
app.use(express.json());
app.use(express.urlencoded({
extended: true
}));
app.use(express.static('public'));
app.get('/', function (req, res) {
res.render('index');
});
app.listen(3000, function () {
console.log('Listening on http://localhost:3000');
});
app.get('/data', function (req, res) {
res.json({"list": ["item1", "item2"]});
});
然后使用ajax从客户端调用该端点
xhttp.open("GET", "/data", true);
返回的数据将是JSON数据{“list”:[“item1”,“item2”]}
,然后您可以使用javascript按需要对其排序
此外,在函数的onreadystatechange
中,您需要使用此if语句确保在从响应中获取响应文本之前成功完成调用
xhttp.onreadystatechange = function() {
if (xhttp.readyState === 4 && xhttp.status === 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
}
这是否意味着我需要创建另一个Node.js服务器?不,应该是相同的。这听起来更像是一个与任务要求相关的问题,而不是结果的执行。