我使用Node.js作为我的服务器,我在提供JS和CSS文件时遇到了一些麻烦。出于某种原因,index.html
似乎无法找到它们。当我加载浏览器时,我收到此错误:
我的文件系统结构:
public
css
main.css
normalize.css
js
main.js
upload.js
plugins.js
views
index.html
server.js
HTML
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="manifest" href="../public/site.webmanifest">
<link rel="apple-touch-icon" href="../public/icon.png">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="../public/css/normalize.css">
<link rel="stylesheet" href="../public/css/main.css">
<script src="../public/js/vendor/modernizr-3.5.0.min.js"></script>
<script
src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js">
</script>
<script src="../public/js/plugins.js"></script>
<script src="../public/js/main.js"></script>
<script src="../public/js/upload.js"></script>
</head>
server.js
var express = require("express");
var app = express();
var path = require("path");
app.use(express.static(path.join(__dirname, 'public')));
app.get('/', function(req, res){
res.sendFile(path.join(__dirname, 'views/index.html'));
});
我的猜测是我在server.js
中错误地提供了公用文件夹。当我尝试直接在浏览器上访问该文件夹时,我得到无法获取/公开。任何专家都可以帮助我吗?
答案 0 :(得分:1)
加载静态资产的方式是错误的。 Express会查找相对于静态目录的文件,因此静态目录的名称不应该是URL的一部分。
如果您使用app.use(express.static(path.join(__dirname, 'public')));
,则可以在http://host:port/css/ *或http://host:port/js/ *加载静态资源。
如果您使用app.use('/public', express.static(path.join(__dirname, 'public')));
,则可以从/ public路径的公共目录加载静态资源。例如,http://host:port/public/css/ *