文章目录
一、node express项目中将静态资源公开
步骤
- 引入依赖模块
- 通过
app.use
公开静态资源
代码
const express = require("express");
// 专门用来辅助操作路径
const path = require("path");
// path.join()【path模块提供的拼接路径的方法】
// __dirname【node内置全局变量】
// 代表动态的绝对路径,使用它与要公开的资源目录拼接,即使资源被移动也能获取正确的路径
app.use('/node_modules/',express.static(path.join(__dirname,'/node_modules/')));
二、为什么使用express的app.use()将静态资源公开了还是读取不到文件。
在解决这个问题之前我们应当先了解一个知识 👉
使用node启动的项目,在寻找相对路径的文件时 (如
app.use
、fs.readFile
等),不是相对于定义该路径的文件,而是相对于执行node命令时所处的终端路径
require
等关于模块的操作除外
拿app.use举例
我们现在通过
app.use()
来公开public
静态资源目录
项目结构如下
现在
app.js
放在了src目录下,在终端打开node_test
目录,运行node src/app.js
。
相对app.js寻找public
可以看到,在
app.js
中想要通过相对路径找到public
目录,应当是./../public
。
- 定义
app.use(服务器启动后能够获取该静态资源的路径别名,静态资源在本地的真实路径)
:
app.use("/public/", express.static("./../public"));
- 结果:
以上,我们可以看到相对app.js获取public是错误的。
相对运行node命令的终端路径寻找public
- 当前的终端路径如下
从
node_test
目录找public
,应当是./public
-
定义app.use
app.use("/public/", express.static("./public"));
-
结果:
app.js源文件
const express = require("express");
const app = express();
app.use("/public/", express.static("./public"));
app.listen(3000, () => {
console.log("server is running on http://127.0.0.1:3000");
});
建议使用__dirname
来拼接,得到绝对路径,避免出错
使用__dirname
来拼接时,后面的部分就要写成相对于当前文件的相对路径。
const express = require("express");
const path = require("path");
const app = express();
console.log(path.resolve(__dirname, "./../public"));
// console结果为:D:\VSfiles\node_test\public
app.use("/public/", express.static(path.join(__dirname, "./../public")));
app.listen(3000, () => {
console.log("server is running on http://127.0.0.1:3000");
});
三、参考文献
- 黑马程序猿nodejs视频教程(李鹏周)