利用node.js模拟Apache服务器请求静态资源,思路:
1、获取到用户向服务器请求的资源的完整路径
2、根据文件的完整路径去读取该文件,如果读取到了,就把文件中数据返回给用户,如果读取不到则返回404
在这个过程中涉及到一个问题:用户向服务器请求不同的资源,服务器需要判断请求的资源类型,在响应头中动态设置Content-Type类型
可以利用第三方模块 mime 实现:
// 使用第三方模块 mime,来判断不同的资源对应的Contnet-Type类型
// filename是请求的资源的完整路径
res.setHeader('Contnet-Type',mime.getType(filename));
利用node.js模拟Apache服务器请求静态资源
因为用到了第三方模块mime,npm install mime,就会出现package-lock.json和node_modules
app.js
const http = require('http');
const path = require('path');
const fs = require('fs');
// 第三方模块,作用:判断不同的资源对应的Contnet-Type类型
const mime = require('mime');
http.createServer((req, res) => {
// 1、获取用户请求的路径 req.url
// 2、获取public目录的完整路径
var publicDir = path.join(__dirname, 'public');
// 3、根据public路径 和 用户请求的路径 计算出用户请求的静态资源的完整路径
var filename = path.join(publicDir, req.url);
console.log(filename);
// 4、根据文件的完整路径去读取该文件,如果读取到了,就把文件中数据返回给用户,如果读取不到则返回404
fs.readFile(filename, (err, data) => {
if (err) {
res.end('文件不存在 404');
} else {
// 使用第三方模块 mime,来判断不同的资源对应的Contnet-Type类型
res.setHeader('Contnet-Type',mime.getType(filename));
// 如果读取到文件,直接返回给用户
res.end(data);
}
})
}).listen(8080, () => {
console.log('http://localhost:8080');
});
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>index</title>
<link rel="stylesheet" href="../css/index.css">
</head>
<body>
<h1>首页</h1>
<img src="../images/index.jpg" alt="index图片">
</body>
</html>
index.css
body{
background-color: #ccc;
}
运行服务器,请求index.html