如何允许客户端从 Node.js + Express 服务器访问任何 static 文件？

Question

这是我的 index.js 文件，称为 node.js 服务器：

var express = require('express');
var app = express();
const PORT = process.env.PORT || 5000;
var serv = require('http').Server(app);
app.get('/', function(req, res) {
    res.sendFile(__dirname + '/client/index.html');
});
app.use('/client', express.static(__dirname + '/client'));
serv.listen(PORT);

我正在使用 Angular 开发客户端应用程序，当我构建应用程序时，我得到了许多客户端文件。 我把它们放在客户目录上。

为了允许客户端访问这些文件，我添加了以下代码：

app.get('/main-es5.js', function(req, res) {res.sendFile(__dirname + '/client/main-es5.js');});
app.get('/main-es2015.js', function(req, res) {res.sendFile(__dirname + '/client/main-es2015.js');});
app.get('/polyfills-es5.js', function(req, res) {res.sendFile(__dirname + '/client/polyfills-es5.js');});
app.get('/polyfills-es2015.js', function(req, res) {res.sendFile(__dirname + '/client/polyfills-es2015.js');});
app.get('/runtime-es5.js', function(req, res) {res.sendFile(__dirname + '/client/runtime-es5.js');});
app.get('/runtime-es2015.js', function(req, res) {res.sendFile(__dirname + '/client/runtime-es2015.js');});
app.get('/styles-es5.js', function(req, res) {res.sendFile(__dirname + '/client/styles-es5.js');});
app.get('/styles-es2015.js', function(req, res) {res.sendFile(__dirname + '/client/styles-es2015.js');});
app.get('/vendor-es5.js', function(req, res) {res.sendFile(__dirname + '/client/vendor-es5.js');});
app.get('/vendor-es2015.js', function(req, res) {res.sendFile(__dirname + '/client/vendor-es2015.js');});

app.get('/main-es5.js.map', function(req, res) {res.sendFile(__dirname + '/client/main-es5.js.map');});
app.get('/main-es2015.js.map', function(req, res) {res.sendFile(__dirname + '/client/main-es2015.js.map');});
app.get('/polyfills-es5.js.map', function(req, res) {res.sendFile(__dirname + '/client/polyfills-es5.js.map');});
app.get('/polyfills-es2015.js.map', function(req, res) {res.sendFile(__dirname + '/client/polyfills-es2015.js.map');});
app.get('/runtime-es5.js.map', function(req, res) {res.sendFile(__dirname + '/client/runtime-es5.js.map');});
app.get('/runtime-es2015.js.map', function(req, res) {res.sendFile(__dirname + '/client/runtime-es2015.js.map');});
app.get('/styles-es5.js.map', function(req, res) {res.sendFile(__dirname + '/client/styles-es5.js.map');});
app.get('/styles-es2015.js.map', function(req, res) {res.sendFile(__dirname + '/client/styles-es2015.js.map');});
app.get('/vendor-es5.js.map', function(req, res) {res.sendFile(__dirname + '/client/vendor-es5.js.map');});
app.get('/vendor-es2015.js.map', function(req, res) {res.sendFile(__dirname + '/client/vendor-es2015.js.map');});

如果没有这么大的代码块，客户端似乎无法访问它。

我该如何重构它？

Answer 1

在构建应用程序时尝试指定deploy-url

ng build --prod --deploy-url=/client

这将告诉 angular 从/client路径而不是根路径加载脚本和资产

由于您已经有了以下行，这应该可以工作。

app.use('/client', express.static(__dirname + '/client'));

Answer 2

将此添加到您的代码中，客户端可以访问项目中的任何文件。

 app.use('*', (req, res) => { res.sendFile(__dirname + req.originalUrl) })