自学内容网 自学内容网

http模块-通过创建的服务器将本地文件转换成web资源

案例-通过创建的服务器将本地文件转换成web资源

  • 目的:将本地文件转换成web资源
  • 思路:将文件实际存放的地址作为每个资源的请求url地址。
  • 大致流程:
    浏览器–请求->自己写的web服务器–读文件->磁盘目录–读取完毕->自己写的web服务器–响应->浏览器
    服务器所读取到的文件内容是字符串,通过res.end()方法响应给客户端,客户端请求回来的不是具体的文件,而是文件中存储的字符串,服务器其实就是充当一个字符串的搬运工。
  • 实现步骤
    • 导入需要的模块
    • 创建基本的web服务器
    • 将资源的请求url地址映射为文件的存放路径(需要用到之前学的path模块的知识)
    • 读取文件内容并响应给客户端(需要用到之前学到的fs模块的知识)
    • 优化资源的请求路径

实现代码

实现代码在最后

  • 首先在终端输入 node 文件名.js命令运行代码启动服务器,如下

  • 根据代码,我们 有两种方式 可以访问,第一种是请求路径为/,因为我们已经在代码中输入了路径,因此直接打开该网址即可,如下
    在这里插入图片描述

  • 然后是第二种,请求路径不为/,我们直接输入要请求的文件/test.html,因为在代码中我们已经拼接其上层路径,如下

  • 可以右键点击页面,选择检查,查看页面源代码

//导入http,path和fs模块
const http = require('http')
//用来读取文件
const path = require('path')
//用来处理文件路径
const fs = require('fs')

//创建web服务器
const server = http.createServer()

//监听web服务器的request事件
server.on('request', (req, res) => {
  //获取到客户端请求的url地址,该url类似于我们上一章,我们在http://127.0.0.1后面添加了/about.html
  //变成了http://127.0.0.1/about.html,那获取到的url即/about.html,使用后面的路径拼接方法即可得到完整的路径
  const url = req.url
  //将请求到的url地址映射为本地文件的存放路径,path.join()方法用于路径拼接,__dirname表示当前代码文件所处文件的路径
  //const fpath = path.join(__dirname, url) //未优化的路径拼接
  //优化后的路径拼接
  let fpath = ''
  if (url === '/') {
    //如果请求的路径是/,则手动指定文件的存放路径,我需要获取的文件资源test.html存放在当前目录的test文件夹内
    fpath = path.join(__dirname, './test/test.html')
  } else {
    //若请求的路径不为/,则动态拼接文件的存放路径
    fpath = path.join(__dirname, './test', url)
  }

  //根据映射过来的文件路径读取文件
  fs.readFile(fpath, 'utf8', (err, dataStr) => {
    //读取文件失败后向客户端响应固定的错误消息
    if (err) {
      return res.end('404 Not found.')
    }
    //读取文件成功后将读取成功的内容响应给客户端
    res.end(dataStr)
  })
})

//启动服务器
server.listen(80, function () {
  console.log('Server listen at http://127.0.0.1')
})

完成!!😊


原文地址:https://blog.csdn.net/thq_kuqi/article/details/136331880

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!