javascript - 使用 Javascript 连接到 Node/Express 路由

Question

当使用 HTML、Javascript 和 Node with Express 创建 Web 应用程序时，我经常希望根据操作更改页面。

在 HTML 中，我可以添加一个 href 链接，然后让我的 app.js Node 文件正确路由。

例如:

在 Node 中:

app.get('/test', function(req,res){
    res.render('public/webpage.html', {name: 'MyName'});
});

在 HTML 中:

<a href="test">Bar</a>

但是，我很难通过 Javascript 而不是 HTML 来做到这一点。在这种情况下，我经常想通过 Javascript 将表单数据发送到我的 Node 服务器，然后让 Node 服务器使用该信息来渲染新页面。

例如:

$.ajax({
    type: 'POST',
    data: JSON.stringify(data),
    contentType: 'application/json',
    url: 'http://localhost:8888/route',
    followAllRedirects: true,
     'success': function(res){
        #Ideally, the webpage would be changed by the node route, 
     }                      
});

在 Node 中:

app.post('/route', function(req,res){
    res.render('public/webpage.html', {name: 'John'});
});

目前，我的 HTTP 请求不会导致呈现新页面，而是返回一个字符串，它是我想要呈现的整个 html 页面。为了轻松解决问题，我只需这样做:

'success': function(res){
    document.location.href = '/newpage.html';
    $('body').replaceWith(res); 
 }

有没有一种方法可以让 JavaScript 方法调用对 Node 服务器的 POST 请求(或可以发送数据的任何类型的请求)，然后让 Node 使用动态变量渲染不同的 html 页面？我不能只执行 window.href.location 因为这不会呈现静态页面的变量输入(这些必须在服务器端计算)。另外，虽然我确信有一种方法可以在 JS 中渲染页面，并且希望获得相关信息，但我更感兴趣的是如何在服务器上执行此操作，因为我认为在那里处理所有重定向会更干净。

谢谢!

Answer 1

您混淆了在网站上提交页面的两种方法，

 res.render('public/webpage.html', {name: 'John'});

用于常规方法，即用户转到您网站上的新地址，服务器为他呈现完整的网页。

在此方法中，服务器负责页面渲染。

从另一方面来说，

 res.json({name: 'John'});

用于SPA方法，其中站点实际上加载一次，每次使用AJAX请求访问服务器时，通常会收到返回的JSON，并使用此JSON更新站点的相关部分页。

在此方法中，客户端负责页面渲染。

您尝试在服务器中呈现页面，但使用客户端方法。