Question

即使我在app.js中创建了静态公用文件夹

当我导航到＆＃34; http://localhost:3000/calenders/add＆＃34;并且我没有获得公共文件夹中的任何样式。因为快递已添加＆＃34; calenders / add /＆＃34;到公用文件夹URL。

所以它看起来像＆＃34; http://localhost:3000/calenders/add/content_inside_public＆＃34;。

但正确的网址应为＆＃34; http://localhost:3000/content_inside_public＆＃34;

导航到app index工作正常并加载所有样式。

当然我可以在这样的app.js中设置静态路径

app.use('/calenders/add',express.static(__dirname + '/public'));

但如果我的应用中有很多路线，那就不实用了。

我相信这种情况正在发生，因为我在视图目录中有一个名为partials的分隔文件夹来存储页眉，页脚和导航栏，这样我就可以轻松地将它们包含在应用程序中的任何位置，而无需一次又一次地编写相同的HTML代码。

这就是我将它们包含在calender / add.ejs中的方式

<!DOCTYPE html>
<html>
<% include ../partials/head.ejs %>
<body>
<!-- Side Navbar -->
<% include ../partials/side_nav.ejs %>

<div class="page">
    <!-- navbar-->
    <% include ../partials/header.ejs %>


    <% include ../partials/footer.ejs %>
</div>
</body>
</html>

这是我访问headers.ejs和footers.ejs中公共目录中的文件夹和样式表的方法

<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/popper.js/umd/popper.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="js/grasp_mobile_progress_circle-1.0.0.min.js"></script>
<script src="vendor/jquery.cookie/jquery.cookie.js"></script>
<script src="vendor/chart.js/Chart.min.js"></script>

这是我的项目结构。

/public
     /css
     /js
     /vendor
     .......
/routes
    calendars.js
    control_panel.js
    index.js
/views
    /calendars
         add.ejs
    /control_panel
         index.ejs
         calendars.ejs
    /partials
         header.ejs
         footer.ejs
         ......
    index.ejs

这是app.js

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

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

app.use('/', index);
app.use('/users', users);
app.use('/control_panel', control_panel);
app.use('/calenders', calenders);

Calendars.js

router.get('/add', function(req, res, next) {
    res.render('calenders/add', { title: 'Express' });

});

control_panel.js

router.get('/', function(req, res, next) {
    res.render('control_panel/index', { title: 'Express' });
});

Answer 1

这与快递无关，

这是因为在 / calenders / add 中，<script src="vendor/jquery/jquery.min.js"></script>的src将解析为http://localhost:3000/calenders/add/vendor/jquery/jquery.min.js，

因为vendor/jquery/jquery.min.js是相对路径。

您需要将网址更改为：

<script src="/vendor/jquery/jquery.min.js"></script>
<script src="/vendor/popper.js/umd/popper.min.js"></script>
<script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/js/grasp_mobile_progress_circle-1.0.0.min.js"></script>
<script src="/vendor/jquery.cookie/jquery.cookie.js"></script>
<script src="/vendor/chart.js/Chart.min.js"></script>

express删除公共文件夹的带前缀的URL

1 个答案: