在Apatch这种Web服务器中，只要打开服务器，那么你就可以在浏览器的地址栏通过相对路劲的方式获取到里面的所有资源。比如服务器的www目录下有一张图片，那么只要在浏览器中输入 domain/some.jpg的方式就可以在客户端直接获取到图片。但在Node中这不行
现在我创建一个文件夹，文件夹中包含 index.js 、hello.html、lvgu.jpg 这三个文件。
其中，在index.js中将对用户的请求返回hello.html， 在hello.html中包含了lvgu.jpg这张图片的地址
index.js
const http =require('http');
const fs = require('fs');
const server = http.createServer(function(req, res) {
fs.readFile('./hello.html', function(err, data) {
res.writeHead(200, { 'Content-Type': 'text/html'})
res.end(data);
})
})
server.listen(3000)
hello.html
<!DOCTYPE html>
<html lang="zh">
<head>
<title>hellow</title>
</head>
<body>
<h1>Hello! 这里有一张英雄的照片</h1>
<img src="./lvgu.jpg" alt="绿谷的图片" srcset="">
</body>
</html>
居然没有将图片展示出来
页面展示
这时因为Node.js没有Web容器的概念， 所以想要将图片加载出来，须在 index.js 中判断请求的url，再返回对应的资源。
const http =require('http');
const fs = require('fs');
const server = http.createServer(function(req, res) {
//根据URL返回不同的内容
if('/' === req.url ){
fs.readFile('./hello.html', function(err, data) {
res.writeHead(200, { 'Content-Type': 'text/html'})
res.end(data);
})
} else if('/lvgu.jpg' === req.url) {
let imgStream = fs.createReadStream('./lvgu.jpg').pipe(res);
}
})
server.listen(3000)
image.png
网友评论