Node-请求响应原理及HTTP协议

1. 服务器端基础概念

1. 网站的组成

1. 网站应用程序主要分为两大部分：客户端和服务器端。
2. 客户端：在浏览器中运行的部分，就是用户看到并与之交互的界面程序。使用HTML、CSS、JavaScript构建。
3. 服务器端：在服务器中运行的部分，负责存储数据和处理应用逻辑。

2. Node网站服务器

1. 能够提供网站访问服务的机器就是网站服务器，它能够接收客户端的请求，能够对请求做出响应。

2. 创建web服务器

// 导入创建网站服务器的模块
const http = require('http');

// 创建网站服务器对象
const app = http.createServer();

// 接收请求
app.on('request', (req, res) => {
    res.end('<h2>hello, nodejs</h2>');
});

app.listen(9001);
console.log('request success');

3. HTTP协议

1. 请求报文

1. 请求方式
   • GET 请求数据
   • POST 发送数据
2. 请求地址 （Request URL）

app.on('request', (req, res) => {
    req.headers  // 获取请求报文
    req.url      // 获取请求地址
    req.method   // 获取请求方法
});

2. 响应报文

1. HTTP状态码
   • 200 请求成功
   • 404 请求的资源没有被找到
   • 500 服务器端错误
   • 400 客户端请求有语法错误
2. 内容类型
   • text/html
   • text/css
   • application/javascript
   • image/jpeg
   • application/json

app.on('request', (req, res) => {
            // 设置响应报文
            res.writeHead(200, {
                'Content-Type': 'text/html;charset=utf8'});
            });

4. HTTP请求与响应处理

1. GET请求参数

1. 参数被放置在浏览器地址栏中，例如：http://localhost:9001/?name=zhangsan&age=20
2. 参数获取需要借助系统模块url，url模块用来处理url地址

const http = require('http');
// 导入url系统模块 用于处理url地址
const url = require('url');
const app = http.createServer();
app.on('request', (req, res) => {
    // 将url路径的各个部分解析出来并返回对象
    // true 代表将参数解析为对象格式
    let { query } = url.parse(req.url, true);
    console.log(query);
});
app.listen(9001);

2. POST请求参数

1. 参数被放置在请求体中进行传输
2. 获取POST参数需要使用data事件和end事件
3. 使用querystring系统模块将参数转换为对象格式

// 导入创建网站服务器的模块
const http = require('http');
// 导入系统模块querystring 用于将HTTP参数转换为对象格式
const querystring = require('querystring');

// 创建网站服务器对象
const app = http.createServer();

// 接收请求
app.on('request', (req, res) => {
    let postData = '';
    // 监听参数传输事件
    req.on('data', param => postData += param);
    // 监听参数传输完毕事件
    req.on('end', () => { console.log(querystring.parse(postData)) });
    res.end('OK');
});

app.listen(9001);
console.log('request success');

3. 路由

1. 路由是指客户端请求地址与服务器端程序代码的对应关系。

 // 当客户端发来请求的时候
 app.on('request', (req, res) => {
     // 获取客户端的请求路径
     let { pathname } = url.parse(req.url);
     if (pathname == '/' || pathname == '/index') {
         res.end('欢迎来到首页');
     } else if (pathname == '/list') {
         res.end('欢迎来到列表页页');
     } else {
        res.end('抱歉, 您访问的页面出游了');
     }
 });

4. 静态资源

服务器端不需要处理，可以直接响应给客户端的资源就是静态资源，例如CSS、JavaScript、image文件。

5. 动态资源

相同的请求地址不同的响应资源，这种资源就是动态资源。

6. 客户端请求路径

1. Get方式

   • 浏览器地址栏
   • link标签的href属性
   • script标签的src属性
   • img标签的src属性
   • Form表单提交

2. Post方式

   • From表单提交

3. 代码实例

const http = require('http');
const url = require('url');
const path = require('path');
const fs = require('fs');
const mime = require('mime');

const app = http.createServer();

app.on('request', (req, res) => {
	// 获取用户的请求路径
	let pathname = url.parse(req.url).pathname;

	pathname = pathname == '/' ? '/default.html' : pathname;

	// 将用户的请求路径转换为实际的服务器硬盘路径
	let realPath = path.join(__dirname, 'public' + pathname);

	let type = mime.getType(realPath)

	// 读取文件
	fs.readFile(realPath, (error, result) => {
		// 如果文件读取失败
		if (error != null) {
			res.writeHead(404, {
				'content-type': 'text/html;charset=utf8'
			})
			res.end('文件读取失败');
			return;
		}

		res.writeHead(200, {
			'content-type': type
		})

		res.end(result);
	});
});

app.listen(3000);
console.log('服务器启动成功')

5. Node.js异步编程

1. 同步API与异步API

1. 同步API

只有当前API执行完成后，才能继续执行下一个API

2. 异步API

当前API的执行不会阻塞后续代码的执行

3. 同步API与异步API的区别 - 获取返回值

同步API可以从返回值中拿到API执行的结果, 但是异步API是不可以的

4. 回调函数

自己定义函数让别人去调用。

// 使用回调函数获取异步API执行结果
function getMsg (callback) {
    setTimeout(function () {
        callback ({ msg: 'Hello Node.js' })
    }, 2000);
}
getMsg (function (msg) { 
    console.log(msg);
});

5. 同步API与异步API的区别 - 代码执行顺序
   • 同步API从上到下依次执行，前面代码会阻塞后面代码的执行。
   • 异步API不会等待API执行完成后再向下执行代码

// 代码先执行同步API，然后在执行异步API
console.log('代码开始执行');
setTimeout(() => {
    console.log('2秒后执行的代码');
}, 2000); 
setTimeout(() => {
    console.log('"0秒"后执行的代码');
}, 0);
console.log('代码结束执行');

6. Promise

解决Node.js异步编程中回调地狱的问题。

const fs = require('fs');

function p1 () {
	return new Promise ((resolve, reject) => {
		fs.readFile('./1.txt', 'utf8', (err, result) => {
			resolve(result)
		})
	});
}

function p2 () {
	return new Promise ((resolve, reject) => {
		fs.readFile('./2.txt', 'utf8', (err, result) => {
			resolve(result)
		})
	});
}

function p3 () {
	return new Promise ((resolve, reject) => {
		fs.readFile('./3.txt', 'utf8', (err, result) => {
			resolve(result)
		})
	});
}

p1().then((r1)=> {
	console.log(r1);
	return p2();
})
.then((r2)=> {
	console.log(r2);
	return p3();
})
.then((r3) => {
	console.log(r3)
})

7. 异步函数

异步函数是异步编程语法的终极解决方案，它可以让我们将异步代码写成同步的形式，让代码不再有回调函数嵌套，使代码变得清晰明了。

• async关键字
  • 普通函数定义前加async关键字 普通函数变成异步函数
  • 异步函数默认返回promise对象
  • 在异步函数内部使用return关键字进行结果返回 结果会被包裹的promise对象中return关键字代替了resolve方法
  • 在异步函数内部使用throw关键字抛出程序异常
  • 调用异步函数再链式调用then方法获取异步函数执行结果
  • 调用异步函数再链式调用catch方法获取异步函数执行的错误信息
• await关键字
  • await关键字只能出现在异步函数中
  • await promise await后面只能写promise对象 写其他类型的API是不不可以的
  • await关键字可是暂停异步函数向下执行 直到promise返回结果

async function p1 () {
	return 'p1';
}

async function p2 () {
	return 'p2';
}

async function p3 () {
	return 'p3';
}

async function run () {
	let r1 = await p1()
	let r2 = await p2()
	let r3 = await p3()
	console.log(r1)
	console.log(r2)
	console.log(r3)
}

run();

const fs = require('fs');
// 改造现有异步函数api 让其返回promise对象 从而支持异步函数语法
const promisify = require('util').promisify;
// 调用promisify方法改造现有异步API 让其返回promise对象
const readFile = promisify(fs.readFile);

async function run () {
	let r1 = await readFile('./1.txt', 'utf8')
	let r2 = await readFile('./2.txt', 'utf8')
	let r3 = await readFile('./3.txt', 'utf8')
	console.log(r1)
	console.log(r2)
	console.log(r3)
}

run();