利用node.js创建一个静态资源服务器

 由于我们无法事先得知一个.html文件中会引用多少个静态资源(.png, .css, .js....),所以,我们不能像处理某个页面一样去处理它们。

我们的解决办法是:

  • 把所有的静态资源(.html,.png,.css,.js)全放在一个指定的目录里;

  • 收到用户的请求之后,去指定的目录下去找对应的文件

    • 找到,把内容读出来返回给用户。

    • 找不到,报404。


"人员"配置:

--静态资源服务器 文件夹

|-public
|-public/index.html
|-public/stye.css
|-public/1.png
|-server.js

代码实现:

const http = require('http')
const path = require('path')
const fs = require('fs')
const obj = {
  ".png": "image/png",
  ".jpg": "image/jpg",
  ".html": "text/html;charset=utf8",
  ".js": "application/javascript;charset=utf8",
  ".css": "text/css;charset=utf8"
}
const server = http.createServer((req, res) => {
  // 如果直接http://localhost:8085 ===> req.url 就是 /,这时,希望它去加载 /index.html
  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)
      if (obj[extName]) {
        // 设置响应头中的content-type
        res.setHeader('content-type', obj[extName])
      }
      res.end(data)
    }
  })
  // res.end(filePath)
})
server.listen(8085) //回调可写可不写

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值