4 http模块

4. http模块

4.1 进一步了解http模块的作用

• 服务器和普通电脑的区别：是否安装了web服务器软件，例如IIS、Apache等，安装这些软件之后，普通电脑变成web服务器
• 在node.js中，不需要使用IIS等第三方WEB服务器软件，可以使用node.js提供的http模块可以轻松手写服务器。
• 域名服务器：提供IP地址和域名之间转换服务的服务器

4.2创建最基本的web服务器

//1.导入http模块
import http from 'http'

//2.床在web服务器实例

const server=http.createServer()

//3.为服务器实例绑定request事件，监听客户端的请求

server.on('request',(req,res)=>{
  console.log("someone visit our web server.")
})

//4.启动服务器

server.listen(8080,()=>{
  console.log("server running at http://127.0.0.1:8080")
})

注意事项：字符串里面若想传变量 ${变量}, 字符串应该用 esc下面那个健打出的引号括起来

4.3 关于req 请求对象

//其中 req 是请求对象，包含了与客户端相关的数据和属性
server.on('request', req =>{
  console.log("someone visit our web server.")

  const url=req.url

  const method=req.method

  const str=`your request url is ${ url },and request method is ${method}`

  console.log(str)
})

4.4关于res响应对象

//其中 req 是请求对象，包含了与客户端相关的数据和属性
server.on('request', (req,res) =>{
  console.log("someone visit our web server.")

  const url=req.url

  const method=req.method

  const str=`your request url is ${ url },and request method is ${method}`

  console.log(str)

  //调用res.end()方法，向客户端响应一些内容
  res.end(str)

})

效果：

4.5 解决中文乱码问题

//其中 req 是请求对象，包含了与客户端相关的数据和属性
server.on('request', (req,res) =>{
  console.log("someone visit our web server.")

  const str=`your request url is ${ req.url },and 请求方法is ${req.method}`

  res.setHeader('Content-Type','text/html; charset=utf-8')
  console.log(str)

  //调用res.end()方法，向客户端响应一些内容
  res.end(str)

})

设置响应头，设置Content-Type为 utf-8即可

4.6 根据不同的url请求得到不同页面内容

• 核心步骤
  1. 获取请求的url地址
  2. 设置默认响应内容为404 NOT found
  3. 判断用户的请求是否为/或者/index.html 首页
  4. 判断用户请求的是否为 /about.html 关于页面
  5. 设置Content-Type 响应头，防止中文乱码
  6. 使用 res.end() 把内容相应给客户端

//其中 req 是请求对象，包含了与客户端相关的数据和属性
server.on('request',(req,res)=>{
  const url=req.url                                     //1
  let content= '<h1> 404 Not Found!</h1>'               //2
  if(url==='/'  || url==='/index.html'){                //3
      content= '<h1>首页 </h1>'
  }else if(url==='/about.html'){                        //4
    content= '<h1><center>关于页面</center></h1>'
  }
  res.setHeader('Content-Type','text/html; charset=utf-8')//5
  res.end(content)                                      //6
})

4.7 clock时钟小案例的实现

// 1.1 导入 http 模块
const http = require('http')
// 1.2 导入 fs 模块
const fs = require('fs')
// 1.3 导入 path 模块
const path = require('path')

// 2.1 创建 web 服务器
const server = http.createServer()
// 2.2 监听 web 服务器的 request 事件
server.on('request', (req, res) => {
  // 3.1 获取到客户端请求的 URL 地址
  //     /clock/index.html
  //     /clock/index.css
  //     /clock/index.js
  const url = req.url
  // 3.2 把请求的 URL 地址映射为具体文件的存放路径
  // const fpath = path.join(__dirname, url)
  // 5.1 预定义一个空白的文件存放路径
  let fpath = ''
  if (url === '/') {
    fpath = path.join(__dirname, './clock/index.html')
  } else {
    //     /index.html
    //     /index.css
    //     /index.js
    fpath = path.join(__dirname, '/clock', url)
  }

  // 4.1 根据“映射”过来的文件路径读取文件的内容
  fs.readFile(fpath, 'utf8', (err, dataStr) => {
    // 4.2 读取失败，向客户端响应固定的“错误消息”
    if (err) return res.end('404 Not found.')
    // 4.3 读取成功，将读取成功的内容，响应给客户端
    res.end(dataStr)
  })
})
// 2.3 启动服务器
server.listen(80, () => {
  console.log('server running at http://127.0.0.1')
})

注意事项

• 1.返回网页，需要将网页数据读取成字符串返回到客户端
• 其中网页中涉及到的CSS 和Js 都会通过html中的链接自动去进行请求，不用写代码请求。