NodeJs-http模块

创建http服务#

使用 nodejs 创建 HTTP 服务

// 导入http模块
const http = require("http")


// 使用createServer创建http服务对象，接收一个回调函数
// 两个形参分别是请求对象和响应对象
// 回调函数的执行时机： 当接收到 HTTP 请求的时候，就会执行
const server = http.createServer((request, response) => {
    console.log(request.headers)

    response.end("end方法用来设置响应体并结束响应")
})

// 监听端口，启动服务
server.listen(8888, () => {
    console.log("run server success port 8888")
})

获取请求数据#

// 导入http模块
const http = require("http")


// 导入url模块，用例URL路径与查询字符串
const urlPackage = require('url')


const server = http.createServer((request, response) => {

    console.log(request.method) // 请求方法
    console.log(request.httpVersion) // 请求版本
    console.log(request.url) // 请求路径, 只能获取路径以及查询字符串，不包含请求域名、断开
    console.log(request.headers) // 全部请求头
    console.log(request.headers.host) // 请求头中的某一个头信息


    /*  获取请求体  */
    let body = ''
    // 要获取可读流对象的内容，就绑定一个data事件去获取，与读取文件一样
    request.on('data', chunk => {
        // 每次读取的结果拼接到body
        body += chunk
    })
    // 读取完之后
    request.on("end", () => {
        console.log(body)
    })


    /* 获取请求路径与查询字符串 */
    // 通过parse方法解析传入的url
    // 第二个参数可选，默认false，如果为true会将查询字符串部分解析为一个对象，主要用来获取查询字符串
    let urlObj = urlPackage.parse(request.url,true)   // url对象，包含url各种信息
    console.log(urlObj.pathname) // url路径,不包含查询字符串
    console.log(urlObj.query.keyword) // 查询字符串 keyword是查询字符串的key

    /* 获取请求路径与查询字符串 第二种方式 */
    // 实例化url对象,参数是路径和host
    let url = new URL(request.url,"http://127.0.0.1:8888")
    console.log(url.pathname) //URL路径,不包含查询字符串
    console.log(url.searchParams.get("a")) // 查询字符串

    response.end("end")


})


// 监听端口，启动服务
server.listen(8888, () => {
    console.log("run server success port 8888")
})

设置响应报文#

1. write方法

   const server = http.createServer((request, response) => {
   
       response.setHeader("Content-Type", "text/html; charset=utf-8") // 响应头
       response.setHeader("test", ["test1", "test2"]) // 如果是多个同名响应头，value直接设置数组
       response.statusCode = 200 // 响应码
       response.statusMessage = "success" //响应状态描述
   
   
       //  有write和end两种方式设置响应体
       
       //  write方法可以多次设置响应 会把结果一起返回
       response.write("test write")
       response.write("test write")
       response.write("test write")
   
       //  end方法只可以设置一次响应
       response.end("test end")
   })
   
   

2. 响应体可以直接返回html、css、js等在页面进行渲染，除了直接在响应方法内写，还可以通过文件读取

   // 读取文件内容
   let html = fs.readFileSunc(__dirname + './index.html')
   // 设置响应体，end方法的参数可以是字符串 也可以是buffer
   response.end(html)
   

静态资源服务#

网页资源加载基本过程#

网页资源的加载都是循序渐进的，首先获取 HTML 的内容， 然后解析 HTML 在发送其他资源的请求，如CSS，Javascript，图片等

 // html中通过link引入css、js等文件
// 访问该路由响应体返回html，只会有标签效果
// 因为请求的回调函数是收到请求时触发的，通过域名发送请求获取css，触发该回调，返回的还是html

    let html = fs.readFileSync(__dirname + './index.html')
    response.end(html)

// 下面这种方法区分请求路径返回不同的资源示例
// 可以搭建静态资源服务来统一解决该问题

// 获取url路径
let {pathname} = new URL(request.url)

if (pathname === "/"){
  	let html = fs.readFileSync(__dirname + './index.html')
    response.end(html)
}else if (pathname === "/index.css"){
    	let css = fs.readFileSync(__dirname + './index.css')
    response.end(css)
}else if (pathname === "/index.js"){
    	let js = fs.readFileSync(__dirname + './index.js')
    response.end(js)
}

搭建静态资源服务#

静态资源是指内容长时间不发生改变的资源 ，例如图片，视频，CSS 文件，JS文件，HTML文件等

动态资源是指 内容经常更新的资源 ，例如百度首页，网易首页，京东搜索列表页面等

    // 获取请求url的路径
    let {pathname} = new URL(request.url,"http://127.0.0.1")

    // 我们的静态资源统一放在固定page路径下

    // 如果请求路径是xxx.css  那就拼接该文件的路径，如果是js 同样拼接
    let filePath = __dirname + '/page' + pathname
    fs.readFile(filePath,(err,data) =>{
        // 将读取到的文件内容响应
        response.end(data)
    })

HTTP 服务在哪个文件夹中寻找静态资源，那个文件夹就是 静态资源目录 ，也称之为 网站根目录

mime类型#

媒体类型（通常称为 Multipurpose Internet Mail Extensions 或 MIME 类型 ）是一种标准，用来表示文档、文件或字节流的性质和格式,类型结构:[主类型/子类型]

HTTP 服务可以设置响应头 Content-Type 来表明响应体的 MIME 类型，浏览器会根据该类型决定如何处理资源

// 常见的媒体类型
const mimes = {
    html: 'text/html',
    css: 'text/css',
    js: 'text/javascript',
    png: 'image/png',
    jpg: 'image/jpeg',
    gif: 'image/gif',
    mp4: 'video/mp4',
    mp3: 'audio/mpeg',
    json: 'application/json'
}

    // 获取请求路径的后缀
    let ext = path.extname(filePath).slice(1)

    // mimes是声明一个对象，类型、value格式，
    let type = mimes[ext] // 通过类型来获取对应的value  text/css

    // 如果类型存在 则设置该类型
    if (type) {
        response.setHeader("content-type", type)

    } else {

        // 对于未知的资源类型，可以选择 application/octet-stream 类型
        // 浏览器在遇到该类型的响应时，会对响应体内容进行独立存储，也就是我们常见的 下载 效果
        response.setHeader("content-type", " application/octet-stream")

    }

解决乱码问题#

// 如果页面内容乱码，可以设置字符集来解决，可以设置响应头，也可以在html中meta中设置字符串
// 响应头的优先级更高
response.setHeader("content-type", type + ';charset=utf-8') 
//text/css;charset=utf-8