一、关于POST请求

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

二、Express如何设置POST请求

1.我们的知道,首先我们得知道在form表单进行post请求,enctype属性一般设置为“application/x-www-form-urlencoded”,如果设置成multipart/form-data,则多用于文件上传,如下:

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

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

(1)、body-parser

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

cnpm install body-parser --save

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

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属性,那么他默认就会是这种。
之后获取数据:

    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

  再引入和构建函数:

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数据在网页开发时经常使用,请务必掌握它,只有这样网页的交互设计才能够做到游刃有余,今天就到这里,也希望大家以后多多支持。

  

Express全系列教程之(四):获取Post参数的两种方式的更多相关文章

  1. Spring Boot2 系列教程(十五)定义系统启动任务的两种方式

    在 Servlet/Jsp 项目中,如果涉及到系统任务,例如在项目启动阶段要做一些数据初始化操作,这些操作有一个共同的特点,只在项目启动时进行,以后都不再执行,这里,容易想到web基础中的三大组件( ...

  2. HttpServletRequest request 获取form参数的两种方式

    @RequestMapping(value="/pay",method = RequestMethod.POST) public String buildRequest(HttpS ...

  3. Android实战简易教程-第四十九枪(两种方式实现网络图片异步加载)

    加载图片属于比较耗时的工作,我们需要异步进行加载,异步加载有两种方式:1.通过AsyncTask类进行:2.通过Handler来实现,下面我们就来看一下如何通过这两种方式实现网络图片的异步加载. 一. ...

  4. flask获取传入参数的两种方式

    #coding=utf-8 from flask import Flask from flask import request app = Flask(__name__) @app.route(&qu ...

  5. php获取post参数的几种方式 RPC 规定接收取值方式 $GLOBALS['HTTP_RAW_POST_DATA'];

    http://www.cnblogs.com/zhepama/p/4022606.html PHP默认识别的数据类型是application/x-www.form-urlencoded标准的数据类型. ...

  6. strus2中获取表单数据 两种方式 属性驱动 和模型驱动

    strus2中获取表单数据 两种方式 属性驱动 和模型驱动 属性驱动 /** * 当前请求的action在栈顶,ss是栈顶的元素,所以可以利用setValue方法赋值 * 如果一个属性在对象栈,在页面 ...

  7. php获取post参数的几种方式

    php获取post参数的几种方式 1.$_POST['paramName'] 只能接收Content-Type: application/x-www-form-urlencoded提交的数据 2.fi ...

  8. spring mvc获取路径参数的几种方式 - 浅夏的个人空间 - 开源中国社区

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  9. 使用web.xml方式加载Spring时,获取Spring context的两种方式

    使用web.xml方式加载Spring时,获取Spring context的两种方式: 1.servlet方式加载时: [web.xml] <servlet> <servlet-na ...

随机推荐

  1. EmbeddedSolrServer的使用与solor6.3.0的使用

    1.    到solr官网下载对应版本的solr: https://lucene.apache.org/solr/ 我下载的是:6.3.0版本(需要JDK8),solr默认集成了jetty容器,而且在 ...

  2. vcenter新建虚拟机centos7作为虚拟机模板

    网卡选项 适配器类型算则E1000 Remote console选项 电源选项 加密 打开电源,连接iso安装系统 按一下tab键,修改网卡为eth0 点击Tab,打开kernel启动选项后,增加ne ...

  3. 浅析nodejs的buffer类(转)

    最近翻阅了node v0.10.4的buffer类的源代码,收获不少,也很久没有在cnode上发表文章了,想把一些收获分享给大家,有什么错误的地方希望大牛们指正啊. 前阵子有位rrestjs框架的使用 ...

  4. [C]关于函数指针参数的赋值

    问题 在有一次尝试用stat()函数获取文件属性的时候,发现如果直接声明一个指针,然后把这个指针作为参数传给函数,会导致函数执行失败,原代码: #include <sys/stat.h> ...

  5. Python的单例模式

    一.何为单例模式 单例模式:保证一个类仅有一个实例,并提供一个访问他的全局访问点. 实现某个类只有一个实例的途径: 1.让一个全局变量使得一个对象被访问,但是他不能防止外部实例化多个对象. 2.让类自 ...

  6. OpenCV imread读取jpg图像的一个大坑

    长话短说 版本区间[OpenCV3.0.0, OpenCV3.4.1]内的OpenCV,(至少在windows下,使用官方提供的预编译版本),imread读取jpg图片后的像素值,和版本区间[Open ...

  7. Java Mybatis实现主从同步

    import org.springframework.jdbc.datasource.lookup.AbstractRoutingDataSource; public class DynamicDat ...

  8. select2 api参数的文档

    具体参数可以参考一下: 参数 类型 描述 Width 字符串 控制 宽度 样式属性的Select2容器div minimumInputLength int 最小数量的字符 maximumInputLe ...

  9. python之re正则简单够用

    0. 1.参考 Python正则表达式指南 https://docs.python.org/2/library/re.html https://docs.python.org/2/howto/rege ...

  10. day26 面向对象 单例模式总结

    如果是在python2中,就需要手动继承object, 基于__new__方法 基于__new__方法 class Foo(object): def __new__(cls,*args,**kwarg ...