node.js - Assets 文件夹中的文件未在子页面中加载

标签 node.js express

我有一个像下面这样的文件夹结构

  • Assets

    • 自举
    • CSS
      • 样式.css
    • js
      • jquery.min.js
  • 观看次数
    • 部分
      • head.ejs
      • header.ejs
      • 脚本.ejs
    • home.ejs
    • user_registration.ejs

在我的 app.js 文件中,我将这个 Assets 文件夹设置为:

var app = express();
app.use('/static', express.static('assets'));
var routes = require('./routes/routes');

在我的 routes.js 文件中

exports.userLogin = function(req, res){
    var userLogin = req.params.userId;
    var users = memberData.users;
    res.render('user_registration', {
        title : 'Welcome',
        users : users
    });
};

在我的 head.ejs 文件中

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="static/bootstrap/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="static/css/style.css" type="text/css">

现在在 user_registration 文件中,我有以下代码

<!DOCTYPE html>
<html lang="en">
<head>
    <% include partials/head.ejs %>
</head>
<body>
    <% include partials/scripts.ejs %>
</body>
</html>

通过使用我的 jQuery,不会加载 Assets 文件夹内的 Bootstrap 文件。但是home.ejs页面运行正常。
当我在控制台检查时,home.ejs 页面以下列格式获取这些文件 http://localhost:3000/static/bootstrap/css/bootstrap.min.css

而 user_registration 页面采用以下格式

http://localhost:3000/user_registration/static/bootstrap/css/bootstrap.min.css

我是 express.js 框架的新手,所以我不知道如何解决这个问题。谁能帮帮我。谢谢。

最佳答案

问题出在代码行中的 app.use('/static', express.static('assets')); 处。
替换为 app.use(express.static(path.join(__dirname, 'assets')));
在你的 head.ejs 文件中替换 bootstrap css calling line
href="static/bootstrap/css/bootstrap.min.css"href="/bootstrap/css/bootstrap.min.css"

希望你明白。

关于node.js - Assets 文件夹中的文件未在子页面中加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44915978/

相关文章:

javascript - 如何判断 Meteor minimongo 何时与 mongo 服务器同步

node.js - REST API : Infinite scroll pagination in the GUI, 但允许搜索所有条目

node.js - 引用错误: session is not defined with ('connect-mongo' )(session),

javascript - 无法加载 c++ bson 扩展

php - Node 使用公共(public)证书加密

javascript - 保存对象的两种方式,有什么区别?

node.js - 安全地从 (node - express - mongodb) 获取数据库结果到 Angular 4

javascript - 使用 Node.js 驱动程序打印和更新 MongoDB 中的所有文档

node.js - node/express REST API 应用程序 - 将参数传递给 GET 方法

mysql - 使用 Node 模块化 Passport.js 时出现问题