通俗易懂之node原生构建简单web服务器

通俗易懂之node原生构建简单web服务器

什么是node.js

学习推荐阅读官网Node.js v10.13.0 Documentation本文档仅做参考理解

node.js就是一个javascript的运行环境,一个平台,也是使用v8引擎解析javascript代码,
是一个服务端的运行环境,所以node中没有BOM和DOM的概念,
node由以下三个部分组成

1.ECMAscript
2.全局成员
3.核心模块API

通过核心模块fs(文件模块),核心模块http(服务器模块),核心模块path(路径模块),全局成员 __dirname(当前文件所在绝对路径)可简单构建web服务器

commonJS规范

node.js实现了commonJS规范,每个js文件都可以视为一个模块,想要在js文件之间引用另一个文件,需要按照commonJS规范来,

commonJS规范中要求要有

1.require函数
2.exports对象
3.module对象

所以可以使用require来导入模块,module.exports来导出模块

例如:

//引入fs内置核心模块
const fs = require('fs')

//导出一个想要暴露出去的对象
module.exports = {
	name:'zs',
	eat() {
		console.log('吃的多')
	}
}

为什么不用exports来导出模块? 因为exports是对module.exports对象的引用,而导出的东西是由module.exports决定的,由于引用数据类型的特性,容易导致两者引用的不是同一个对象,所以使用module.exports能确保导出的是你想要的

fs模块

fs模块: File System 文件系统, node提供用于操作文件或目录的API都在该模块中

1.文件读取

fs.readFile()

例如:

const fs = require('fs')
fs.readFile('./src/index.txt','utf-8',(err,data) => {
	// code something
})

参数①:要读取的文件路径,如果是相对路径,相对的不是当前文件的路径,相对的是执行node命令的路径,所以若要使用相对路径,使用__dirname进行拼接

参数②:以什么字符集来读取,一般要指定,比如utf-8编码,默认为null

参数③:回调函数,读取完毕执行的函数,有两个参数,第一个为错误信息err,第二个为读取的数据data

2.文件写入

fs.writeFile() 文件写入会覆盖已存在的文件

例如:

const fs = require('fs')
fs.writeFile('./src/222.txt','222222', err => {
	// code something	
})

参数①:同上,推荐使用__dirname进行拼接

参数②:要写入的内容

可选参数③: 写入的字符集,默认为utf-8,可直接用默认的

参数④:回调函数,有一个参数err,错误信息,若成功写入,则没有错误信息,err为null

3.文件追加

fs.appendFile()

例如:

const fs = require('fs')
fs.appendFile('./src/222.txt','\n3333',err => {
	// code something
})

参数①:同上,推荐使用__dirname进行拼接

参数②:要追加的内容

可选参数③: 写入的字符集,默认为utf-8,可直接用默认的

参数④:回调函数,有一个参数err,错误信息,若成功写入,则没有错误信息,err为null

文件写入和文件追加都会在没有目标文件的时候创建文件.

path模块

node中的相对路径都是相对当前执行node命令的目录,所以需要__dirname进行路径拼接,而拼接路径则需要path模块

path模块用处很大,功能很多,具体请阅读官方文档

文件拼接:

path.join() 用来拼接路径片段

const path = require('path')
path.join('/foo', 'bar', './baz/asdf', 'quux', '..');
// 返回: '/foo/bar/baz/asdf'

在路径片段中支持.和…操作, 分别表示当前目录和上一级目录, 传入的参数必须是字符串, 返回的结果也是字符串(拼接好的路径)

从上诉例子中可以看到path.join()方法功能强大,所以对fs模块中的改进为:

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

fs.readFile(path.join(__dirname,'src/index.txt'),'utf-8',(err,data) => {
	// code something
})

http核心模块搭建web服务器

综合上诉知识,可以使用http模块来搭建web服务器了

1.引入核心模块http

const http = require('http')

2.得到http模块后,使用http.createServer()方法来创建服务器

const server = http.createServer()

3.绑定监听事件,通过server.on('request',(req,res) => { }) 绑定事件并指定处理函数

server.on('request',(req,res) => { 
	//code something
})

回调函数用来处理业务逻辑,参数1:req表示request,和请求有关的对象，res表示response，响应相关的对象。

①返回简单文字

根据req对象的url属性来判断用户访问的哪个url,再根据业务逻辑返回不同的数据或页面.

server.on('request',(req,res) => { 
	//解决中文乱码
    res.writeHeader(200,{
        "Content-Type": 'text/plain; charset=utf-8'
    })
	
	if(req.url == '/'){ //请求网页根目录
		res.end('hello world 我是天才')
	}
})

res.end用来向客户端返回数据

②返回某个页面

server.on('request',(req,res) => {
    let url = req.url

    // 访问网站根目录的时候 让url重新赋值为实际目录
    if(url === '/') url = '/views/index.html'

    // 浏览器访问的时候输入指定的路径,后台可直接使用url变量
    // 不指定编码格式  则以二进制返回 buffer
    fs.readFile(path.join(__dirname,url),(err,buf) => {
        if(err) return res.end('404 Not Found')
        res.end(buf)
	})

})

此处通过导入fs模块,调用fs模块的文件读取方法,将想要读取的文件读取成数据,通过res.end返回客户端.

4.通过server.listen(3000,'127.0.0.1',() => { })来开启服务器

server.listen(3000,'127.0.0.1', () +> {
	// code something
	//eg:  console.log('server running at http://127.0.0.1:3000')
})

参数1:端口号,表示要将服务器开启在哪个端口.需要注意避免与常用的端口冲突,如避免使用80 、3306等端口

参数2:ip地址,服务器将要部署在那个ip地址,本机调试可以写127.0.0.1,代表本机,可省略不写

参数3:启动成功的回调函数

整合上述内容,完整的代码应为:

服务器文件: app.js

//导入需要的模块
const fs = require('fs')
const http = require('http')
const path = require('path')

//创建服务器对象
const server = http.createServer()

//监听请求
server.on('request',(req,res) => {
    let url = req.url

    // 访问网站根目录的时候 让url重新赋值为实际目录
    if(url === '/') url = '/views/index.html'

    // 浏览器访问的时候输入指定的路径,后台可直接使用url变量
    // 不指定编码格式  则以二进制返回 buffer
    fs.readFile(path.join(__dirname,url),(err,buf) => {
        if(err) return res.end('404 Not Found')
        res.end(buf)
    })

})

//开启服务器
server.listen(3000,() => {
	console.log('server running at http://127.0.0.1:3000')
})

index.html文件为:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="/css/index.css">
<script src="/js/index.js"></script>
<title>Document</title>
</head>
<body>
	<h1>首页</h1>
</body>
</html>

这里面的js文件和css文件,是因为网站根目录下有js文件夹,css文件夹，根据上面的路由规则,会直接返回对应文件

最后使用在根目录打开控制台,运行node app.js 即可在浏览器中输入http://127.0.0.1:3000/查看首页信息

express框架

由于上述方法属于node原生实现搭建服务器功能,比较繁琐,且功能比较弱,仅推荐学习使用,想要更强大的功能,更好的体验.推荐使用node知名框架express.可以快速,轻松的搭建Web服务器.