Express js在一个目录中获取所有静态文件时遇到404错误

Question

为了方便管理静态文件，我创建了多个目录。 其中一些静态文件位于客户端目录，而一些仪表板相关的文件位于src目录中，因此现在我的目录结构如下：

/
|
client //static files and other stuff
server //server side express, app, controller, models etc
src //other static files

我有两个Angular应用程序，一个在client文件夹中，另一个在src文件夹中，我的服务器端路由如下 -

app.route('/app/dashboard-v1').get(function(req,res){
        res.sendFile(path.join(__dirname, '../src', 'index.html'));
    });

    // All undefined asset or api routes should return a 404
    app.route('/:url(api|img|src|auth|components|app|bower_components|assets)/*')
        .get(errors[404]);

    // All other routes should redirect to the index.html
    app.route('/*')
        .get(function (req, res) {
            res.sendFile(path.resolve(app.get('appPath') + '/index.html'));
        });

所以我的第一个Angular应用程序位于app/dashboard-v1中，所有其他URL都将重定向到app2

我正确地获取了app2中的所有文件，但是我在第二个应用程序中获取所有其他文件时都出现404错误。 如果我注释掉

//  app.route('/:url(api|img|src|auth|components|app|bower_components|assets)/*')
            .get(errors[404]);

我希望你能将第二个应用程序的index.html文件在第一个应用程序的所有文件中获取，而不是出现404错误。

我的express配置如下 -

if ('production' === env) {
    app.use(favicon(path.join(config.root, 'public', 'favicon.ico')));
    app.use(express.static(path.join(config.root, 'public')));
    app.set('appPath', path.join(config.root, 'public'));
    app.use(morgan('dev'));
  } else {
    app.use(require('connect-livereload')());
    app.use(express.static(path.join(config.root, '.tmp')));
    app.use(express.static(path.join(config.root, 'client')));
    app.use(express.static(path.join(config.root, 'src')));
    app.set('appPath', path.join(config.root, 'client'));
    app.use(morgan('dev'));
    app.use(errorHandler()); // Error handler - has to be last
  }

我猜我的路由设置有问题，该怎么解决？ 在我的第一个应用程序(app/dashboard-v1)的index.html中，我添加了

。

<base href="/src/" />

所有在我的 index.html 中的链接都是相对链接，就像以下这个块所示，它来自 src/index.html (应用程序 / 仪表板-v1 url 应用程序) -

<script src="vendor/angular/angular-animate/angular-animate.js"></script>
  <script src="vendor/angular/angular-cookies/angular-cookies.js"></script>

当我在浏览器中打开网络控制台时，发送到服务器的请求如下所示 -

Request URL:http://localhost:9000/src/vendor/angular/angular-animate/angular-animate.js

我在浏览器控制台上看到了404状态码，提示我无法访问该网页。

- Harshit Laddha

Answer 1

请问您是在例子的 / 目录下运行应用程序吗？

我认为您需要将 __dirname 设置为静态文件夹。

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

或者，如果您想要设置特定的文件夹，可以像这样进行设置：

app.use("/public", express.static(__dirname + "/public"));
app.use("/public2", express.static(__dirname + "/public2"));

- AugustoL

---

谢谢你的回答，这就是我所缺少的。 你也可以像这样避免字符串连接。<br> app.use('/public', express.static(path.join(__dirname, 'public'))); - TomerBu