[JavaScript知识库]Node.js express框架 ，路由中获取数据

框架:是一整套解决方案，提供了项目开发中的常用功能，简化了已有的功能

Node.js中常见的框架：express、koa、egg

1. express框架

网址：https://www.expressjs.com.cn/

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

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

npm install expreess

(1)创建WEB服务器

const express=require('express');//引入express第三方模块

const app=express();//创建WEB服务器

app.listen(8080);//设置端口.

路由：路由根据请求的方法和请求的URL作出特定的响应，是一个独立的方法

路由三要素:请求的方法、请求的URL、回调函数

res响应的对象.

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

res.redirect()设置跳转的URL并发送

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

req请求的对象

req.url获取请求的

URLreq.method获取请求的方法

req.query获取get传递的数据(查询字符串)，结果为对象

?练习：编写文件03_express.js，使用express创建WEB服务器，添加路由(get ?/search)，响应搜索的网页search.html。

根据表单的提交，添加对应的路由(get ?/mysearch)，响应'搜索成功'

创建03_express.js：

//引入express第三方模块
const express=require('express');
//引入官方核心模块
const querystring=require('querystring');
//创建WEB服务器
const app=express();
//设置端口
app.listen(8081,()=>{
	console.log('服务器创建成功');
});

//添加路由
//请求的方法:get  响应文件search.html
app.get('/search',(req,res)=>{
	res.sendFile(__dirname+'/search.html')
});

app.get('/mysearch',(req,res)=>{
	//获取get传递的数据（格式为查询字符串）
	//获取请求的URL,获取请求的方法
	console.log(req.query);
	res.send('搜索成功');
});

创建search.html：

<!-- 
form:表单标签，用于表单提交(向服务器发请求)
method:设置请求的方法
action:/设置请求的URL
name:起的名字保存用户输入的值
-->
<form method="get" action="/mysearch">
	<input type="text" name='kw' placeholder="请输要搜索的内容" />
	<input type="submit">
</form>

控制台脚本模式运行：

打开浏览器输入 127.0.01:8081/search 输入笔记本点提交

?

?

2.路由中获取数据

观察数据的传递方式和之前的区别

练习：使用express创建WEB服务器，添加路由(get ?/reg)，响应注册的网页reg.html，点击提交向服务器发请求(post /myreg)，响应‘注册成功 ?当前用户名：xx’

?

//引入express第三方模块
const express=require('express');
//引入官方核心模块
const querystring=require('querystring');
//创建WEB服务器
const app=express();
//设置端口
app.listen(8080,()=>{
	console.log('服务器创建成功');
});
//添加路由
//请求的方法:get  响应文件reg.html
app.get('/reg',(req,res)=>{
	res.sendFile(__dirname+'/reg.html')
});
app.post('/myreg',(req,res)=>{
	//post传递的数据以流的方式,分为多段,需要通过事件获取
	//一旦有数据流入到内存，自动触发事件,通过回调函数获取
	req.on('data',(chunk)=>{
		//chunk就是获取的分段数据
		console.log(chunk);
		//转为字符串,格式为查询字符串
		var str=chunk.toString();
		console.log(str);
		//借助查询字符串模块解析为对象
		var obj=querystring.parse(str);
		console.log(obj);
		res.send('当前用户名:'+obj['user']);
	});
});

<form method="post" action="myreg" float="left">
	用户：<input type="text" name='user'/>
	密码：<input type="text" name="password"/>
	邮箱：<input type="text"/>
	手机：<input type="text"/>
	<input type="submit">
</form>

点提交结果：

?