创建文件
|-public
|-public/index.html
|-public/stye.css
|-public/1.png
|-server.js
把所有的静态资源全放在public下面,然后使用server.js来启动web服务器。
// 目标
// 完成server.js代码
// http://localhost:8082/index.html <----- public/index.html
// http://localhost:8082/style.css <----- public/style.css
const http = require('http')
const path = require('path')
const fs = require('fs')
// 策略模式
// .png --> 'image/png'
// .html --> 'text/html;charset=ytf8'
// .js --> 'application/javascript;charset=utf8'
// .css --> 'text/css;charset=utf8'
const obj = {
".png ": " 'image/png'",
".jpg": "image/jpg",
".html ": " 'text/html;charset=ytf8'",
".js ": " 'application/javascript;charset=utf8'",
".css ": " 'text/css;charset=utf8'"
}
const server = http.createServer((req, res) => {
const url = req.url === '/' ? 'index.html' : req.url
// 如果 req.url 要访问的文件在public能找到,就读出来,返回
const filePath = path.join(__dirname, 'public', url)
console.log('要访问的地址是', filePath);
fs.readFile(filePath, (err, data) => {
if (err) {
res.statusCode = 404
res.end('not found')
} else {
const extName = path.extname(filePath)
console.log('本次请求的资源', extName, filePath)
// 设置响应头的content-type
// .png --> 'image/png'
// .html --> 'text/html;charset=ytf8'
// .js --> 'application/javascript;charset=utf8'
// .css --> 'text/css;charset=utf8'
// if (extName === '.png') {
// res.setHeader('content-type', 'image/png')
// } else if (extName === '.html') {
// res.setHeader('content-type', 'text/html;charset=ytf8')
// } else if (extName === '.js') {
// res.setHeader('content-type', 'application/javascript;charset=utf8')
// } else if (extName === '.css') {
// res.setHeader('content-type', 'text/css;charset=utf8')
// }
if (obj[extName]) {
res.setHeader('content-type', obj[extName])
}
res.end(data)
}
})
// if(filePath存在){
// 读出来,返回
// } else{
// 返回404
// }
// res.end(filePath)
})
server.listen(8082)