Nodejs day04 5/24

框架：是一整套解决方案，简化了已有的功能，添加了之前没有的功能。

1.express框架

基于Node.js平台，快速，开放，极简的WEB开发框架

网址：www.expressjs.com.cn

属于第三方的模块，需要先去下载安装

npm  install  express

(1)路由

路由用来处理不同的请求，根据请求的URL和请求的方法作出特定的响应

路由的三要素：请求的URL ，请求的方法，回调函数

req.method()  获取请求的方法

req.query()  获取查询字符串传递的数据

res.send() 设置响应的内容并发送

res.redirect()    设置响应的重定向并发送

res.sendFile()     设置响应的文件并发送，文件必须使用绝对路径（__dirname）

以上响应在一个路由中只能调用一次

练习：编写03_express.js,引入express,创建web服务器并设置端口为8080，添加路由（get  ./search）,响应文件search.html

'<h2>用户搜索</h2>'

const express = require('express');
const app = express();
app.listen(8080);
app.get('/search',(req,res)=>{
	res.sendFile(__dirname+'/search.html');

});

根据表单的请求添加路由（get  /mysearch）,响应搜索成功

添加路由（get  /login）,响应文件login.html

用户输入用户名，密码，点击提交，添加对应的路由（post  /mylogin）,响应‘登入成功’

//03_express.js

const express = require('express');
const app = express();
app.listen(8080);

app.get('/search',(req,res)=>{
	res.sendFile(__dirname+'/search.html');
	

});
/*
app.get('/mysearch',(req,res)=>{
	//获取请求的URL和请求方法
		//console.log(req.url,req.method);
	//获取已查询字符串格式传递的数据
		console.log(req.query);
	res.send('搜索成功');
});
*/
app.get('/login',(req,res)=>{
	res.sendFile(__dirname+'/login.html');
	
});

app.post('/mylogin',(req,res)=>{
	console.log(req.query);
	res.send('登录成功');
});

//login.html

<h2>用户登录</h2>

<form method="post" action="/mylogin">
  用户<input type = "text" name="uname"><br>
  密码<input type = "password" name="upwd"><br>
<input type = "submit">
</form>

传递方式	格式	路由获取
get传递	查询字符串 http://127.0.0.1:8080/mysearch?kw=笔记本&id=2	req.query 格式为对象
post传递	采用流的方式，不可见	通过事件的方式 req.on('data',(chunk)=>{ chunk  获取的数据，格式为buffer,转字符串为查询字符串，需要借助查询字符串模块解析为对象}）
路由传参	http://127.0.0.1:8080/package/express	app.get('/package/:paname',(req,res)=>{req.params  获取路由传参的数据，格式为对象 }）

对比get和post传递数据的区别：
get传递的数据格式为查询字符串，URL中可见，post传递的方式用流的方式，URL中不可见；post传递更加安全，通常注册、登录会使用；
get传递的速度快，通常搜索的时候使用
get传递的数据有大小限制，根据不同的浏览器大小不同，范围2~8k之间，post没有大小限制
 

练习：创建添加购物车的路由（get /shopping）,传递商品的编号lid,购买的数量count,用户的编号uid，最后响应以下内容

商品的编号：xx

购买的数量：xx

用户的编号：xx

/shopping/30&1&5

app.get('/shopping/:lid&:count&:uid',(req,res)=>{
	//获取路由传参的数据
		console.log(req.params);
res.send(`
	商品的编号:${req.params.lid}<br>

	购买的数量:${req.params.count}<br>

	用户的编号:${req.params.uid}
`);
});

课后任务

（1）复习今天内容，整理思维导图

（2）练习：创建web服务器，设置端口，添加路由(get /reg)，响应注册（get  /reg）,响应注册的文件reg.html，点击提交向服务器发送请求（post， /myreg）,创建路由器接收请求，并获取传递的数据，响应注册成功

//reg.html

<h2>用户注册</h2>
<form method="post" action="/myreg">
   用户<input type="text" name="uname"><br/>
   密码<input type="password" name="upwd"><br/>
   手机<input type="text" name="phone"><br/>
   邮箱<input type="text" name="email"><br/>
<input type="submit">
</form>

//zuoye.js

const express = require('express');
const querystring = require('querystring');
const app = express();
app.listen(8080);

app.get('/reg',(req,res)=>{
	res.sendFile(__dirname+'/reg.html');
});

app.post('/myreg',(req,res)=>{
	req.on('data',(chunk)=>{
		console.log(chunk.toString);
		let obj = querystring.parse(chunk.toString());
		console.log(obj);
});
res.send('登录成功');
});
/*
app.get('/reg/:uname&:upwd&:phone&:email',(req,res)=>{
	console.log(req.params);
res.send(`
	用户名:${req.params.uname}

	密码:${req.params.upwd}

	手机:${req.params.phone}

	邮箱:${req.params.email}
`);
*/
});

用户  密码  邮箱 手机 提交