node.js

真的想不出名儿

已于 2023-08-06 16:59:37 修改

阅读量1.2k

点赞数

分类专栏： node.js 文章标签： node.js

于 2023-08-05 16:47:33 首次发布

本文链接：https://blog.csdn.net/ioncannontic/article/details/132121840

版权

node.js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

什么是Node.js

Node.js 是一个免费的、开源的、跨平台的 JavaScript 运行时环境,使开发者可以搭建服务器端的JavaScript应用程序

概念: 使用Node.js编写后端程序 // 支持前端工程化

后端程序：提供接口和数据，网页资源

前端工程化:对代码压缩，转译，整合测试自动部署（使用各种工具，提升效率）

Node.js为何能执行js?

浏览器能执行js代码，依靠的是内核中的v8引擎(c++程序)

Node.js是基于Chrome V8引擎进行封装(运行环境)
区别:都支持ECMAScript标准语法，Node.js有独立的api (Node环境没有DOM和Bom)
在这里插入图片描述

Node.js安装

https://nodejs.org/dist/v18.17.0/ 下一步安装

注意:

1: 安装在非中文路径下

2.无需勾选安装其他的配置软件

检测是否安装成功

windows+r 打开cmd中断输入node -v 命令查看版本号

使用node.js

新建js文件，编写代码，在node环境下运行

在vscode集成终端中，输入node xxx.js 回车执行

console.log("hello")
for(let i = 0;i<3;i++){
    console.log(6)
}

fs模块-读写文件

模块：类似插件，封装了方法/属性

fs模块：封装了与本机文件系统进行交互的方法/属性

加载fs模块

const fs = require('fs')

写入文件内容

fs.writeFile('文件路径','写入内容',err=>{
   //写入后的回调函数
})

读取文件内容

fs.readFile('文件路径',(err,data)=>{
   //写入后的回调函数
   //data文件内容的Buffer数据流
})

path模块–路径处理

在node.js中，使用绝对路径

__dirname 模块内置变量(获取当前模块目录名)

案例-压缩前端 html

压缩前端代码，让浏览器加载网页更快

前端工程化:对代码压缩，转译，整合测试自动部署（使用各种工具，提升效率）

需求：把回车符和换行符去掉进行压缩，写入到新html中

读取html文件内容
正则替换字符串
写入到新的html文件中

public/index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div class="box">
        <ul>
            <li>111</li>
            <li>222</li>
            <li>333</li>
        </ul>
    </div>
</body>

</html>

public/index,js

console.log('123');
for (let i = 0; i < 4; i++) {
    console.log(i);
}

build.js

/* 
需求：把public/index.html里的回车符，和换行符去掉，进行压缩，写入到新dist/index.html中

- 读取html文件内容
- 正则替换字符串
- 写入到新的html文件中
 
需求：压缩js里的代码，并整合到html中一起运行
1.读取js文件内容
2.正则替换内容  
3.拼接html内容写入到 dist/index.html
*/

const fs = require('fs')
const path = require('path')

// 把public / index.html里的回车符，和换行符去掉，进行压缩，写入到新dist / index.html中
fs.readFile(path.join(__dirname, 'public', 'index.html'), (err, data) => {
    const htmlStr = data.toString()
    // console.log(htmlStr);
    // 正则替换字符串
    const resultStr = htmlStr.replace(/[\r\n]/g, '')
    // console.log(resultStr);
    fs.readFile(path.join(__dirname, 'public', 'index.js'), (err, data1) => {
        const jsStr = data1.toString()
        // console.log(jsStr);
        // 正则替换字符串
        const jsResultStr = jsStr.replace(/[\r\n]/g, '').replace(/console.log\('.+'\);/g, '')
        // console.log(jsResultStr);
        // 写入到新的html文件中
        fs.writeFile(path.join(__dirname, 'dist', 'index.html'), resultStr + jsResultStr, err => {
            if (err) { console.log(err); }
            else { console.log('压缩成功'); }
        })
    })
})

URL中的端口号

URL ：统一资源定位符，简称网址，用于访问网络上的资源

端口号:标记服务器里对应服务程序（0-65535的整数）

http://xxxx.com:88/api/login

http模块–创建web服务

基于http模块编写程序，返回给请求方 ‘hello world’

引入http模块，创建web服务对象
监听request请求事件，对本次请求，做一些响应处理
启动web服务监听对应端口号
运行本服务在终端，用浏览器发起请求

案例:基于web服务，开发提供省份列表数据的接口，了解后端的代码工作过程

test01.js

/*
 1.基于http模块，创建web服务
 2.使用req.url 获取请求资源路径，并获取province.json 里省份数据返回给请求方
 3.其他路径，暂时返回不存在的提示
 4.运行web服务，用浏览器发起请求
*/
// 1. 基于http模块，创建web服务
const fs = require('fs')
const path = require('path')
const http = require('http')
const server = http.createServer()

// 2. 监听request请求事件，对本次请求，做一些响应处理
server.on('request', (req, res) => {
    // console.log(req.url);
    if (req.url === '/api/province') {
        fs.readFile(path.join(__dirname, 'data/province.json'), (err, data) => {
            res.setHeader('Content-Type', 'application/json;charset=utf-8')
            res.end(data.toString())
        })
    } else {
        res.setHeader('Content-Type', 'text/html;charset=utf-8')
        res.end('您请求的资源不存在')
    }
})

server.listen(3000, () => {
    console.log('web 服务启动了');
})

参数查询
test02.js

/* 
 1.基于http模块，创建web服务
 2.判断req.url资源路径 +查询字符串  路径前缀匹配  /api/city
 3.借助 querystring 模块的方法，格式化查询字符串  ?pname = '北京'
 {
    pname:"北京"
 }

 4.获取city.json 里省份下的城市列表
 4.返回城市列表 运行web服务，用浏览器发起请求
*/
// 1. 基于http模块，创建web服务
const qs = require('querystring')
const fs = require('fs')
const path = require('path')
const http = require('http')
const server = http.createServer()

// 2. 监听request请求事件，对本次请求，做一些响应处理
server.on('request', (req, res) => {
    // console.log(req.url);
    // 使用req.url 获取请求资源路径，并获取province.json 里省份数据返回给请求方
    if (req.url === '/api/province') {
        fs.readFile(path.join(__dirname, 'data/province.json'), (err, data) => {
            res.setHeader('Content-Type', 'application/json;charset=utf-8')
            res.end(data.toString())
        })
        // startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
    } else if (req.url.startsWith('/api/city')) {
        // /api/city?pname =北京
        // 以?分隔符分隔  拿到pname=北京 
        // 把查询参数字符串 转成js对象结构
        const str = req.url.split('?')[1]
        // console.log(str);
        const query = qs.parse(str)
        console.log(query);
        // 拿到省份名字
        const pname = query.pname
        // 读取city.json 城市数据，匹配省份名字下的城市列表
        fs.readFile(path.join(__dirname, 'data/city.json'), (err, data) => {
            const obj = JSON.parse(data.toString())
            // 省份名字作为key，去obj对象里取到对应的城市
            const cityList = obj[pname]
            res.setHeader('Content-Type', 'application/json;charset=utf-8')
            res.end(JSON.stringify(cityList))
        })
    } else {
        res.setHeader('Content-Type', 'text/html;charset=utf-8')
        res.end('您请求的资源不存在')
    }
})

server.listen(3000, () => {
    console.log('web 服务启动了');
})

test03.js

const qs = require('querystring')
const fs = require('fs')
const path = require('path')
const http = require('http')
const server = http.createServer()
server.on('request', (req, res) => {
    if (req.url === '/api/province') {
        fs.readFile(path.join(__dirname, 'data/province.json'), (err, data) => {
            res.setHeader('Content-Type', 'application/json;charset=utf-8')
            res.end(data.toString())
        })
    } else if (req.url.startsWith('/api/city')) {
        const str = req.url.split('?')[1]
        const query = qs.parse(str)
        // console.log(query);
        const pname = query.pname
        fs.readFile(path.join(__dirname, 'data/city.json'), (err, data) => {
            const obj = JSON.parse(data.toString())
            const cityList = obj[pname]
            res.setHeader('Content-Type', 'application/json;charset=utf-8')
            res.end(JSON.stringify(cityList))
        })
    } else if (req.url === '/index.html') {
        fs.readFile(path.join(__dirname, 'dist/index.html'), (err, data) => {
            res.setHeader('Content-Type', 'application/json;charset=utf-8')
            res.end(data.toString())
        })
    }

})
server.listen(3000, () => {
    console.log('web服务开启了');
})

基于express软件包，创建web服务

/* 
基于express本地软件包  开发web服务 返回资源给请求方
*/
// 1.下载express软件包
// 2.导入并创建web服务对象
const express = require('express')
const server = express()

// 3.监听请求的方法和资源路径
server.get('/', (req, res) => {
    res.send("您好 欢迎使用express")
})

server.get('/province', (req, res) => {
    res.send("省份已查询到")
})

// 4/监听任意的请求方法和请求的资源路径
server.all('*', (req, res) => {
    res.status(404)
    res.send("您访问的资源路径不存在")
})

// 5监听端口号 启动web服务
server.listen(3000, () => {
    console.log("web服务已启动")
})