Express全系列教程之(四)：获取Post参数的两种方式

时间 2019-11-08

标签 express 系列教程获取 post 参数两种方式栏目 HTTP/TCP 繁體版

原文原文链接

1、关于POST请求

post方法做为http请求很重要的一部分，几乎全部的网站都有用到它，与get不一样，post请求更像是在服务器上作修改操做，它通常用于数据资源的更新。
相比于get请求，post所请求的数据会更加安全。上一章中咱们发现get请求会在地址栏显示输入的用户名和密码(有中文时会转化为BASE64加密)，而post请求则会将数据放入http包的包体中，这使得别人没法直接看到用户名和密码！javascript

2、Express如何设置POST请求

1.咱们的知道，首先咱们得知道在form表单进行post请求，enctype属性通常设置为“application/x-www-form-urlencoded”，若是设置成multipart/form-data，则多用于文件上传，以下：html

<form action="#" method="post" enctype="application/x-www-form-urlencoded">
</form>

　　以后，咱们可使用npm提供的body-parser或者connect-multiparty来获取post数据。我也会把两种方式都进行演示：java

（1）、body-parser

Express中默认都使用body-parser做为请求体解析post数据，这个模块也能解析：JSON、Raw、文本、URL-encoded格式的请求体。
首先在项目目录安装body-parser：express

cnpm install body-parser --save

　　在项目app.js中,引用和设置该模块：npm

const bodyParser=require("body-parser");

// 解析以 application/json 和 application/x-www-form-urlencoded 提交的数据
var jsonParser = bodyParser.json();
var urlencodedParser = bodyParser.urlencoded({ extended: false });

bodyParser.json()很明显是将json做为消息主题，再且常见的语言和浏览器大都支持json规范，使得json处理起来不会赶上兼容性问题。
application/x-www-form-urlencoded：
若是form表单不设置enctype属性，那么他默认就会是这种。
以后获取数据：json

    app.post("/",urlencodedParser,function(req,res){
    	res.send(req.body);
    });

在中间添加urlencodedParser，请求是依然使用req.body获取数据。
下面是一个完整的实例：
index.html：浏览器

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="http://localhost:8080/" method="post" enctype="application/x-www-form-urlencoded">
			用户：
			<input type="text" name="user" id="user" placeholder="用户名"><br>
			密码：
			<input type="password" name="password" id="password" placeholder="密码"/><br>
			<input type="submit" value="提交"/>
		</form>
	</body>
</html>

　　app.js：安全

const express=require("express");
const bodyParser=require("body-parser");

var app=express();

// 解析application/json数据
var jsonParser = bodyParser.json();
// 解析application/x-www-form-urlencoded数据
var urlencodedParser = bodyParser.urlencoded({ extended: false });

app.post('/',urlencodedParser,function(req,res){
	res.send(req.body);
});

app.listen(8080);

　　（2）、connect-multiparty

虽然connect-multiparty多用于文件上传，但也能够访问到post请求的数据，先安装服务器

cnpm install connect-multiparty --save

　　再引入和构建函数：app

const multipart = require('connect-multiparty');
var multipartMiddleware = multipart();
```
一样咱们也采用req.body来获取参数：

```
app.post('/',multipartMiddleware,function(req,res){
	res.send(req.body);
});

　　完整的：

const express=require("express");
const multipart = require('connect-multiparty');
var multipartMiddleware = multipart();

var app=express();

app.post('/',multipartMiddleware,function(req,res){
	res.send(req.body);
});

app.listen(8080);

　　相比于body-parser，代码量彷佛更少一些，但我仍是建议使用body-parser，根据官方说法，他会在服务器上建立临时文件，而且永远不会去清理它们，这会至关两会系统资源，因此不到万不得已请不要去使用它。

总结

post数据在网页开发时常常使用，请务必掌握它，只有这样网页的交互设计才可以作到游刃有余，今天就到这里，也但愿你们之后多多支持。