Node.js入门笔记（包含源代码）以及详细解析

Node.js 入门笔记源码

01、如何在终端中执行js 文件

• 目标：将下面的代码语句在中断中执行

  • 代码演示：

`console.log('Hello World')

for (let i = 0;i < 3;i++) {

  console.log(6)

}`

• 方法：在文件上右击打开在终端中执行，然后输入node空格 输入需要执行的文件名字

02、基于 fs 模块读写文件内容

• 目标：使用fs模代码操作文件在终端中的读写操作

• + 1、加载 fs 模块对象

  • 2、写入文件内容-----》writeFile文件中没有文件会自动帮我们创建
  • 3、读取文件

  • 代码演示：

@@

// 1、加载 fs 模块对象
const fs = require('fs')

// 2、写入文件内容
    // 2.1：test.txt为文件路径名字
    // 2.2：写入的内容
    // 2.3：回调函数，返回错误打印出来， 否则成功
fs.writeFile('test.txt','Hello World',(err) => {
    if(err) console.log(err)
    else console.log('写入成功')
})


// 3、读取文件
fs.readFile('test.txt',(err,data) => {
    if (err) console.log(err)
    // else console.log(data)      //
    else console.log(data.toString())  //toString() 转为字符串形式
})

• 执行结果为:

  写入成功
  Hello World

03、path模块-路径问题

问题： Node.js代码中，相对路径是根据终端所在路径在查找的，可能无法找到你想要的文件

• 因此，建议在Node.js代码中，使用绝对路径（也就是需要在终端执行的代码内容）

• __dirname 内置变量 （动态获取当前模块目录-绝对路径）

  **path.join()**会使用特定于平台的分隔符，作为定界符，将所有给定的路径片段连接在一起

语法：1.加载path模块

​ 2.使用path.join(__dirname, 目标文件的路径)方法，拼接路径

• 代码演示

• 错误例子

//1、 引入 fs 模块  通过终端读取文件内容
// const fs = require('fs')
// fs.readFile('test.txt',(err,data) => {
//     if (err) console.log(err)
//     else console.log(data.toString())  //执行成功，将十六进制转换为字符串形式返回结果
// })
// 这里使用相对路径就发生报错error

• 正确示例
• path.join()方法里面，第一个参数就是__dirname 当前所在文件的文件夹地址（终端的位置） ，第二个就是目标文件的路径

// 2、解决方式：只有采用绝对路径
        // 1、引入 fs 模块
        const fs = require('fs')
        // 2、引入 path 模块对象
        const path = require('path')
        // 3、调用path.join()方法  配合 __dirname  组成目标文件的绝对路径
        console.log(__dirname)
        fs.readFile(path.join(__dirname,'../test.txt'),(err,data) => {
            if (err) console.log(err)
            else console.log(data.toString())
        })

04、基于node.js 压缩前端文件

• 目标：把回车符（\r） 和 换行符（\n）去掉后，写入到新html文件中。

实现方法：

1. 读取源html文件内容

   • 源html文件 === (public文件夹下面的index.html文件) 未经过压缩的源代码

2. 正则替换字符串

3. 写入到新的html文件中

   • 新的html文件 === （dist文件夹下面的index.html文件） 经过node使用正则压缩后的代码

// 读取public文件夹里面的前端源代码
// 1.引入读取模块fs
const fs = require('fs')
// 2.拼接路径获取绝对路径
const path = require('path')
// 3、 __dirname当前文件夹所在的地址   进行查找文件
fs.readFile(path.join(__dirname,'public/index.html'),(err,data) => {
  if (err) console.log(err)
  else {
    // 4、将返回的内容转为字符串显示
    const htmlStr = data.toString()

    // 5、进行字符串替换 正则查找全局
    // replace()是一个字符串方法，用于将指定的字符或子串替换为新的字符或子串。
    const resultStr = htmlStr.replace(/[\r\n]/g,'')
    console.log(resultStr)
    // 6、写入到新的  html 文件中
    fs.writeFile(path.join(__dirname,'dist/index.html'),resultStr,err => {})   //writeFile文件中没有文件会自动帮我们创建
    if (err) console.log(err)
    else {
      console.log('写入成功')
    }
  }
})

05、URL中的端口号

1.URL:简称网址，用于访问服务器里的资源

2. http://hmajax.itheima.net:80/api/province ==> 这里面：80就是 端口号

3.端口号范围：0~65535之间的任意整数 端口号默认为：80（注意1023之前的端口号是特定的被系统占用不可使用）

06、http模块-创建Web服务

• 实现步骤：

  1、加载http模块，创建Web服务对象

  2、监听require请求事件，设置响应头和响应体

  3、配置端口号并启动Web服务

  4、浏览器请求 http：//localhost:3000则是我们的创建的web服务对象

​

• 代码示例

// 1、加载http模块，创建Web服务对象
const http = require('http')
const server = http.createServer()//调用http里面的方法
// 2、监听require请求事件，设置响应头和响应体
server.on('request',(req,res) => {
    // 设置响应头-内容类型-普通文本以及中文编码格式
    res.setHeader('Content-Type','text/plain;charset=utf-8')  //这里都是固定的内容类型
    // 设置响应体内容，结束本次请求与相应
    res.end('欢迎使用 Node.js 和 http 模块创建的 Web服务')
})

// 3、配置端口号并启动Web服务
server.listen(3000,() => {
    console.log('Web 服务启动成功了')
})

• 代码详细说明

  • 这段代码是使用Node.js的http模块创建一个简单的Web服务，以下是对代码的逐行解释：

    1. 第一行代码const http = require('http')，加载了Node.js的http模块，并将其赋值给变量http，以便后续使用该模块提供的功能。
    2. 第二行代码const server = http.createServer()，调用http模块中的createServer()方法创建一个HTTP服务器对象，并将其赋值给变量server。此时的服务器对象还没有进行具体的请求处理配置。
    3. 第四行代码server.on('request', (req, res) => { ... })，通过server对象的on方法监听request事件，该事件会在有客户端请求到达服务器时触发。回调函数接收两个参数：req表示请求对象，res表示响应对象。
    4. 在回调函数中，通过res.setHeader('Content-Type', 'text/plain;charset=utf-8')设置响应头，将内容类型设为普通文本以及中文编码格式。
    5. 接着，通过res.end('欢迎使用 Node.js 和 http 模块创建的 Web服务')设置响应体内容，并结束本次请求与相应。
    6. 最后一行代码server.listen(3000, () => { ... })，通过server对象的listen方法配置服务器监听的端口号为3000，并启动Web服务。当服务器成功启动后，回调函数会被执行，输出一条信息表示服务器启动成功。

    综上，这段代码创建了一个简单的Web服务，监听在本地主机的3000端口上。当有请求到达时，会返回固定的欢迎消息。你可以通过访问http://localhost:3000来查看Web服务的响应。

07、基于Web服务，开发提供网页资源的功能

基于Web服务，开发提供网页资源的功能

• • 目标：基于 Web 服务，开发提供网页资源的功能
  • 步骤：
  • 1. 基于 http 模块，创建 Web 服务
  • 2. 使用 req.url 获取请求资源路径，并读取 index.html 里字符串内容返回给请求方
  • 3. 其他路径，暂时返回不存在提示
  • 4. 运行 Web 服务，用浏览器发起请求

• 代码示例

// 1. 基于 http 模块，创建 Web 服务
const fs = require('fs')
const path = require('path')
const http = require('http')
const server = http.createServer()
server.on('request',(req,res) => {      //req为代表客户端发送的HTTP请求对象。res为代表服务端发送的HTTP响应对象
  // 2、使用 req.url 获取请求资源路径，并读取 index.html 里字符串内容返回给请求方
  if (req.url === '/index.html')  {
    fs.readFile(path.join(__dirname,'dist/index.html'),(err,data) => {
      if (err) console.log(err)
      else {
        // 设置响应内容的类型为html超文本字符串 ，让浏览器解析成标签网页等
        res.setHeader('Content-Type','text/html;charset=utf-8')
        res.end(data.toString())
      }
    })
  } else {
    // 3. 其他路径，暂时返回不存在提示
    res.setHeader('Content-Type','text/html;charset=utf-8')
    res.end('你要访问的资源路径不存在')
  }
  
})
server.listen(8080,() => {
  console.log('Web 服务启动成功')
})

《代码解析》

• 这段代码的详细原理如下：

  1. 首先，引入了http、fs和path模块，并通过http.createServer()创建了一个HTTP服务器对象，并将其赋值给server变量。同时，使用server.on('request', (req, res) => { ... })监听request事件，传入回调函数处理请求。
  2. 在回调函数中，首先通过req.url获取到客户端请求的资源路径。如果资源路径为/index.html，则进入条件判断块。
  3. 在条件判断块中，使用fs.readFile()方法读取指定路径下的index.html文件内容。其中，通过path.join(__dirname, 'dist/index.html')构建出index.html的完整路径。在回调函数中，判断是否有读取错误，若有错误则输出错误信息；若没有错误，则设置响应头的Content-Type为text/html;charset=utf-8，表示响应内容类型为HTML文档，然后通过res.end(data.toString())将读取到的文件内容作为响应体发送给客户端。
  4. 如果资源路径不是/index.html，则执行默认的else分支，设置响应头的Content-Type为text/html;charset=utf-8，并通过res.end('你要访问的资源路径不存在')返回一个提示消息给客户端。
  5. 最后，通过server.listen(8080, () => { ... })配置服务器监听的端口号为8080，并在服务器成功启动后输出一条提示信息。

  总结来说，这段代码创建了一个简单的HTTP服务器，当客户端请求的资源路径为/index.html时，会读取指定路径下的index.html文件内容并返回给客户端，否则返回一个资源不存在的提示消息。通过监听request事件和处理回调函数，实现了对不同请求路径的处理和响应。最后，通过server.listen()方法指定监听的端口号，并在服务器成功启动后输出启动成功的提示信息。

• 关于request监听函数中的req和res的详细解释

  • 在Node.js的http模块中，req和res是通常用于表示HTTP请求对象和HTTP响应对象的变量名。

    • req（或者常见的缩写）是request的缩写，代表客户端发送的HTTP请求对象。它包含了与请求相关的各种信息，如请求方法、URL、请求头、请求参数等。通过req对象，我们可以获取和解析客户端发送的请求数据，以便在服务器端进行处理和响应。
    • res（或者常见的缩写）是response的缩写，代表服务端发送的HTTP响应对象。它用于设置和发送服务端的响应给客户端。通过res对象，我们可以设置响应的状态码、响应头、响应体内容等。最终，将响应发送给客户端，完成HTTP请求-响应周期。

    在HTTP请求过程中，客户端发送请求给服务器，服务器接收到请求后创建一个req对象来表示该请求。然后，服务器处理请求并生成相应的内容，将其存放在一个res对象中，并通过网络将res对象发送给客户端。

    所以，req和res分别代表了客户端发送的HTTP请求对象和服务端返回的HTTP响应对象，在开发Web应用时，我们可以使用这两个对象来实现对请求的处理和对响应的配置。