Node + Express与静态HTML。 如何将所有请求路由到index.html?

我正在使用Node + Express和handelbars来处理单个页面的Web应用程序。 目前所有的东西都可以很好地运行,从一个漂亮的server.js文件中提供的index.html:

var express = require('express'); var server = express(); server.use(express.static(__dirname + '/public')); var port = 10001; server.listen(port, function() { console.log('server listening on port ' + port); }); 

http://localhost:10001/加载时,这是完美的。 我的问题是,我在应用程序中使用推状态,所以浏览器可能会显示一个URL,如http://localhost:10001/foo/bar ,然后如果我刷新页面,我得到错误Cannot GET /foo/bar因为这里没有路线。

所以我的问题,并赦免我的令人难以置信的noobishness节点,我可以让所有的请求路由到index.html? 我的应用程序中的JavaScript可以处理基于页面加载的URL参数显示正确的内容。 我不想定义自定义路由,因为数字会很大,path可以dynamic改变。

       

网上收集的解决方案 "Node + Express与静态HTML。 如何将所有请求路由到index.html?"

 var express = require('express'); var server = express(); server.use('/public', express.static(__dirname + '/public')); server.get('/*', function(req, res){ res.sendFile(__dirname + '/index.html'); }); var port = 8000; server.listen(port, function() { console.log('server listening on port ' + port); }); 
 var app = express(); var options = { dotfiles: 'ignore', etag: true, extensions: ['htm', 'html'], index: 'index.html', lastModified: true, maxAge: '1d', setHeaders: function (res, path, stat) { res.set('x-timestamp', Date.now()); res.header('Cache-Control', 'public, max-age=1d'); } }; app.use(compression()); app.use(bodyParser.urlencoded({ extended: false })); app.use(bodyParser.json()); app.use(methodOverride()); app.use('/', express.static(__dirname + '/public', options)); app.use('*', express.static(__dirname + '/public', options)); 

这种模式将在提供前端应用程序的全线path之前提供静态资源。 要注册任何附加路线,只需将它们添加到全部路线上。

 var express = require('express'); var static = require('serve-static'); var server = express(); // middleware server.use(express.static(__dirname + '/public')); // routes server.use('*', function (req, res) { // serve file }); var port = 10001; server.listen(port, function() { console.log('server listening on port ' + port); }); 
 var express = require('express'); var server = express(); server.use(express.static(__dirname + '/public')); server.get('*', function(req, res){ res.sendFile('index.html'); }); var port = 10001; server.listen(port, function() { console.log('server listening on port ' + port); }); 

这个简短的事情将起作用:

 import express from "express"; const app = express(), staticServe = express.static(`${ __dirname }/public`); app.use("/", staticServe); app.use("*", staticServe); 

只要确保HTML / JS文件中的所有URL都是绝对的,因为所有不存在的资源都将返回index.html文件。

Express v 4.15.2