初识Node.js与内置模块

• path.join() 方法，用来将多个路径片段拼接成一个完整的路径字符串
• path.basename() 方法，用来从路径字符串中，将文件名解析出来

如果要在 JavaScript 代码中，使用 path 模块来处理路径，则需要使用如下的方式先导入它：

 3.2 路径拼接

1. path.join() 的语法格式

使用 path.join() 方法，可以把多个路径片段拼接为完整的路径字符串，语法格式如下：

 参数解读：

• ...paths <string> 路径片段的序列
• 返回值: <string>

2. path.join() 的代码示例

使用 path.join() 方法，可以把多个路径片段拼接为完整的路径字符串：

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

//注意 ../会抵消前面的路径
const pathStr = path.join('/a', '/b/c', '../', './d', 'e')
console.log(pathStr); //\a\b\d\e

fs.readFile(path.join(__dirname, './files/1.text'), 'utf-8', function (err, dataStr) {
    if (err) {
        return console.log(err.message)
    }
    console.log(dataStr);
})

1. path.basename() 的语法格式

使用 path.basename() 方法，可以获取路径中的最后一部分，经常通过这个方法获取路径中的文件名，语法格式如下

 参数解读

• path <string> 必选参数，表示一个路径的字符串
• ext <string> 可选参数，表示文件扩展名
• 返回: <string> 表示路径中的最后一部分

2. path.basename() 的代码示例

使用 path.basename() 方法，可以从一个文件路径中，获取到文件的名称部分：

const path = require('path')

// 定义文件存放路径
const fpath = 'a/b/v/index.html'

const fullName = path.basename(fpath)
console.log(fullName);//index.html

const nameWithoutExt = path.basename(fpath, '.html')
console.log(nameWithoutExt)//index

3.4 获取路径中的文件扩展名

1. path.extname() 的语法格式

使用 path.extname() 方法，可以获取路径中的扩展名部分，语法格式如下

 参数解读：

• path <string>必选参数，表示一个路径的字符串
• 返回: <string> 返回得到的扩展名字符串

2. path.extname() 的代码示例

使用 path.extname() 方法，可以获取路径中的扩展名部分：

const path = require('path')
//文件存放路径
const fpath = '/a/b/c/index.html'
const frxt = path.extname(fpath)
console.log(frxt);//.html

 3.5 综合案例 - 时钟案例

1. 案例要实现的功能

2. 案例的实现步骤

• ① 创建两个正则表达式，分别用来匹配 <style> 和 <script> 标签
• ② 使用 fs 模块，读取需要被处理的 HTML 文件
• ③ 自定义 resolveCSS 方法，来写入 index.css 样式文件
• ④ 自定义 resolveJS 方法，来写入 index.js 脚本文件
• ⑤ 自定义 resolveHTML 方法，来写入 index.html 文件

3. 步骤1 - 导入需要的模块并创建正则表达式

 3. 步骤2 - 使用 fs 模块读取需要被处理的 html 文件

 3. 步骤3 – 自定义 resolveCSS 方法

 3. 步骤4 – 自定义 resolveJS 方法

 3. 步骤5 – 自定义 resolveHTML 方法

 4. 案例的两个注意点

• ① fs.writeFile() 方法只能用来创建文件，不能用来创建路径
• ② 重复调用 fs.writeFile() 写入同一个文件，新写入的内容会覆盖之前的旧内容

//导入fs模块
const fs = require('fs')

//导入path模块
const path = require('path')

//定义正则表达式,分别匹配style和script标签
const regStyle = /<style>[\s\S]*<\/style>/
const regScript = /<script>[\s\S]*<\/script>/

//调用fs.readFile读取文件
fs.readFile(path.join(__dirname, './index.html'), 'utf-8', function (err, dataStr) {
    // 读取html文件失败
    if (err) return console.log('读取文件失败', err.message)
    // 读取文件成功后,调用相对于的三个方法 分别解析出 css HTML js
    resolveCss(dataStr)
    resolveJS(dataStr)
    resolveHtml(dataStr)
})

// 定义处理css样式的方法
function resolveCss(htmlStr) {
    //使用正则提取需要的内容
    const r1 = regStyle.exec(htmlStr)

    //将提取出来的的样式字符串进行字符串的replace替换
    const newCss = r1[0].replace('<style>', '').replace('</style>', '')


    // 调用fs.writeFile方法,将提取的样式写入到clock目录中 index.css文件中
    fs.writeFile(path.join(__dirname, './clock/index.css'), newCss, function (err) {
        if (err) return console.log('写入 CSS 样式失败！' + err.message)
        console.log('写入样式文件成功！')
    })
}
// 定义处理js脚本的方法
function resolveJS(htmlStr) {
    //使用正则提取需要的内容
    const r2 = regScript.exec(htmlStr)

    //将提取出来的的样式字符串进行字符串的replace替换
    const newJs = r2[0].replace('<script>', ' ').replace('</script>', ' ')


    // 调用fs.writeFile方法,将提取的样式写入到clock目录中 index.js文件中
    fs.writeFile(path.join(__dirname, './clock/index.js'), newJs, function (err) {
        if (err) return console.log('写入 js脚本 失败！' + err.message)
        console.log('写入js脚本成功!')
    })
}
// 定义处理html样式
function resolveHtml(htmlStr) {
    //将字符串调用replace方法把内嵌的style和script替换Wie外联的link 和 script
    const newHTML = htmlStr.replace(regStyle, '<link rel="stylesheet" href="./index.css">').replace(regScript, '<script src="./index.js"></script>')
    //写入index.html文件
    fs.writeFile(path.join(__dirname, './clock/index.html'), newHTML, function (err) {
        if (err) return console.log('写入html文件失败');
        console.log('写入html文件成功');
    })
}

4. http 模块

4.1 什么是 http 模块

// ① 导入 http 模块
const http = require('http')
// ② 创建 web 服务器实例
const server = http.createServer()
// ③ 为服务器实例绑定 request 事件，监听客户端的请求
server.on('request', function (req, res) {
    console.log('Someone visit our web server');
})
// ④ 启动服务器
server.listen('80', function () {
    console.log('server runing at http://127.0.0.1:80');
})

const http = require('http')
const server = http.createServer()
//请求对象包含了与客户端相关的一些数据和属性
server.on('request', (req, res) => {
    //req.url是客户端请求的url地址
    const url = req.url
    // req.method是客户端请求的method类型
    const method = req.method
    const str = `You request url is ${url} and request method is ${method}`
    console.log(str);
    //调用res.end方法向客户端响应一些内容
    res.end(str)
})
server.listen(80, () => {
    console.log('server runing at http://127.0.0.1');
})

const http = require('http')
const server = http.createServer()
server.on('request', (req, res) => {
    // ① 获取请求的 url 地址
    const url = req.url
    // ② 设置默认的响应内容为 404 Not found
    let content = '<h1>404 Not found!</h1>'
    // ③ 判断用户请求的是否为 / 或 /index.html 首页
    // ④ 判断用户请求的是否为 /about.html 关于页面
    if (url === '/' || url === '/index.html') {
        content = '<h1>首页</h1>'
    } else if (url === '/about.html') {
        content = '<h1>关于页</h1>'
    }
    // ⑤ 设置 Content-Type 响应头，防止中文乱码
    res.setHeader('Content-Type', 'text/html;charset=utf-8')
    // ⑥ 使用 res.end() 把内容响应给客户端
    res.end(content)
})
server.listen(80, () => {
    console.log('server runing at http://127.0.0.1');
})

// 导入http模块
const http = require('http')
//导入 fs 系统模块
const fs = require('fs')
//导入 path模块
const path = require('path')

//创建 web 服务器
const server = http.createServer()
//监听web服务器的request 事件
server.on('request', (req, res) => {
    //获取到客户端请求的url地址
    //  /clock/index.html
    //  /clock/index.css
    //  /clock/index.js
    const url = req.url
    // 把请求的url地址映射到具体文件的存放路径
    // const fpath = path.join(__dirname, url)

    //预定义一个空白的文件存放路径
    let fpath = ''
    if (url === '/') {
        fpath = path.join(__dirname, './clock/index.html')
    } else {
        // /index.html
        // /index.css
        // /index.js
        fpath = path.join(__dirname, '/clock', url)
    }


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

})
//启动服务器
server.listen(80, () => {
    console.log('server runing at http://127.0.0.1');
})