如何路由 Node.js 单页应用程序？答案

【问题标题】：How to route a Node.js Single Page App?如何路由 Node.js 单页应用程序？
【发布时间】：2018-01-02 15:39:33
【问题描述】：

我正在尝试使用具有多个选项卡的 Node.js 设计一个单页应用程序，并且每个选项卡上可以包含许多图像或脚本，所以我想防止每次加载每个选项卡的内容用户访问该页面。因此，理想情况下，当用户切换选项卡时，服务器会发送包含图像和脚本的 html，而客户端会在不重新加载页面的情况下显示它。

我选择 SPA 设计的原因是，在标签之外是一个聊天系统以及其他在后台运行的东西，我不想在每次重定向发生时都重新发送给客户。

所以我的问题是发送 html 的最佳方式是什么，或者总体上是否有更好的方式仍然使用 SPA 设计？

最好的方法是将路由器中的 html 发送到客户端，然后使用 ajax 防止页面刷新并添加新标签页 html 并删除旧标签页 html 吗？

【问题讨论】：

标签： javascript jquery node.js ajax single-page-application

【解决方案1】：

Express.js 只能与一个 route 一起使用。

这条路线可以被称为：

var app = require('express')();

app.get('/',function(req, res) {
 res.sendFile(path.join(__dirname + '/index.html'));
}

注意：

这是一条 GET 路由
它只是用sendFile发送文件内容

之后，您可以使用许多 API 路由来获取选项卡的数据。我建议这些路线是这样的：

app.post('/about',function(req, res) {
 res.json({ data: "your data here" });
}

app.post('/contact',function(req, res) {
 res.json({ data: "your data here" });
}

在这些路线上请注意：

这些是 POST 路由
只返回一个 JSON

【讨论】：

【解决方案2】：

SPA 的意思是“单页应用程序”，您将只有一个 HTML shell，然后 JavaScript 框架将处理“页面”和之后的 HTML

【讨论】：

但是你仍然需要一个服务器端路由器来获得正确的状态码——比如404和403。否则，搜索引擎会将它们编入索引。
但是在客户端 javascript 中，我应该使用 ajax 的 preventDefault() 来停止页面重定向，然后在客户端选择新选项卡时接收数据吗？并且在服务器路由器中，当它收到来自客户端的 GET 或 POST 时，是否应该发送新的选项卡数据？
是的。但听起来您应该先熟悉 SPA 使用的一般方法和常用框架，然后再“从头开始”开发：(en.wikipedia.org/wiki/Single-page_application)