当您有两条不同的主要路线时，如何在 ejs 文件中加载资产？答案

【问题标题】：how to load assets in ejs file when you have two different main routes?当您有两条不同的主要路线时，如何在 ejs 文件中加载资产？
【发布时间】：2026-01-22 16:10:02
【问题描述】：

我有一个简单的博客快递应用程序，我设置了两条不同的主要路线，常规路线（登录、发布、注册等...）和管理员（添加帖子、编辑帖子等...）问题是我的assets、css 或任何其他静态文件不会仅在 管理路由 中加载，但幸运的是可以在常规路由中加载。我的快速设置如下：

app.use('/admin/pages', adminPages);
app.use('/', pages);

所以在调查了两个主要路线的 chrome 开发人员工具之后，这就是问题所在，但不知道如何解决它！这是管理员路由不加载引导程序或 css 文件的时候：请注意，所有资产在 localhost:3005 之后都以不需要的 (admin/pages/...) 为前缀

但它在这里工作（没有前缀）：

这是我的文件结构：

完整的 App.js：

const express = require('express'),
    app = express(),
    path = require('path'),
    mongoose = require('mongoose'),
    bodyParser = require('body-parser'),
    pages = require('./routes/pages.js'),
    config = require('./config/database'),
    expressSession = require('express-session'),
    expressValidator = require('express-validator'),
    adminPages = require('./routes/admin_pages.js');

mongoose.connect(config.database);
const database = mongoose.connection;
database.on('error', console.error.bind(console, '@@error with database:'));
database.once('open', () => {
    console.log('Connected To Database successfully');
});

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'public')));
// app.use(express.static('public'));

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.set('trust proxy', 1);
app.use(
    expressSession({
        secret: 'keyboard cat',
        resave: false,
        saveUninitialized: true,
        cookie: { secure: true }
    })
);

app.use(require('connect-flash')());
app.use(function(req, res, next) {
    res.locals.messages = require('express-messages')(req, res);
    next();
});

app.use(
    expressValidator({
        errorFormatter: function(param, msg, value) {
            var namespace = param.split('.'),
                root = namespace.shift(),
                formParam = root;
            while (namespace.length) {
                formParam += '[' + namespace.shift() + ']';
            }
            return {
                param: formParam,
                msg: msg,
                value: value
            };
        }
    })
);

app.use('/admin/pages', adminPages);
app.use('/', pages);

const port = 3005;
app.listen(port, () => {
    console.log(`App Listening @ localhost:${port}`);
});

add_page.ejs：

<%- include('../_layouts/header') %>

    <form>
        <input type="text" />
        <input type="text" />
        <input type="text" />
        <button> submit </button>
    </form>
    <%- include('../_layouts/footer') %>

这是我的两条主要路线：

【问题讨论】：

你能分享你的意见文件吗？
@vitomadio 我已经用我的文件结构的图像更新了帖子。 tks
我想你的样式链接在 header-admin.ejs 布局中，对吧？然后你在 add_page.ejs 中导入这个部分，如果有错请纠正我。
是的，header 和 header-admin 非常相似，但几乎没有额外的链接。它适用于 index.ejs 时使用部分而不是 add_page.ejs
尝试从admin文件夹中取出add_pages.ejs，放到index.ejs的同一个根目录

标签： node.js express npm assets

【解决方案1】：

我找到了答案。当使用两个主要路由时，您需要指定每个路由到其静态文件，因此我们为常规路由提供了这个中间件，如下所示：

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

因为您有另一条用于管理/页面的路线，所以缺少：

app.use('/admin/pages', express.static('public'));

这解决了问题：D

【讨论】：

【解决方案2】：

在我的情况下，我只使用一个主要路线，所以我更改了资产 url，在 url 的开头添加了一个 /，它对我有用：

<link rel="stylesheet" href="assets/css/style.css">

到

<link rel="stylesheet" href="/assets/css/style.css">

也许它对其他人有帮助，问候！

【讨论】：