html - node.js 脚本无法获取静态文件

标签 html node.js express

我有一个基本的 HTML index.html 和一些容器,我将 bootstrapfont awesome 文件夹添加到 <head>文件的一部分。 如:

<link href="../bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="../bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<link href="font-awesome/css/font-awesome.css" rel="stylesheet">

然后,我写了一个web.js脚本首先初始化服务器,然后添加那些包含静态文件的文件夹,以这种方式:

var express = require('express');
var app = express();
var fs = require('fs');

var buf = fs.readFileSync("index.html");
app.use(express.logger());

app.get('/', function(request, response) {
  response.send(buf.toString());
});

app.configure(function(){
    app.use(express.static(__dirname + '/assets'));
    app.use(express.static(__dirname + '/bootstrap'));
    app.use(express.static(__dirname + '/font-awesome'));
});

var port = process.env.PORT || 8080;
app.listen(port, function() {
  console.log("Listening on " + port);
});

但是当我去 http://localhost:8080我从试图获取 bootstrap.css 的 GET 命令中得到 404 错误等等。有什么帮助吗?我尝试了从 stackoverflow 获得的不同脚本,但我似乎无法正确处理。 谢谢!

最佳答案

通过以这种方式初始化 express.static,您告诉它在根目录之外的那些文件夹中查找任何请求的文件。

如果您要删除路径:

<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/font-awesome.css" rel="stylesheet">

您的静态 Assets 很可能会被发现。但是,您会遇到麻烦,因为任何重复的文件名都会导致返回第一个文件名。

相反,您可能希望将所有静态 Assets 放在一个目录下,或者将不同的路径参数添加到您的 app.use 语句中,以更好地组织一切。

文件布局:

public
 |-- bootstrap
 |-- font-awesome

相应的 app.use 语句(并从您的 html 路径中删除 ..):

app.use(express.static(path.join(__dirname, 'public')); 

或多个静态中间件(并从您的 html 路径中删除 ..):

app.use('/bootstrap', express.static(path.join(__dirname, '/bootstrap')));
app.use('/font-awesome', express.static(path.join(__dirname, '/font-awesome')));

上述任一的 HTML 更改:

<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<link href="font-awesome/css/font-awesome.css" rel="stylesheet">

关于html - node.js 脚本无法获取静态文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18110436/

相关文章:

javascript - 如何使用普通 JavaScript 获取列表中的 span 值?

javascript - 为什么document.getElementById().style.transform "transform"的="translateX()"只会翻译一次?

html - 简单的 Bootstrap 类不起作用

node.js - 在node js中使用Multer上传文件

javascript - 如何在Firestore中正确使用arrayUnion?

javascript - 如何使用javascript获取包含所有标签和元素值的html页面

node.js - 使用node_xslt进行转换

javascript - 如何在异步方法中使用await内部await并在最后返回结果?

javascript - "user validation failed: passsword: Path ` 密码 ` is required."

javascript - Mongoose 子文档数组不保存整个对象?