一、关于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,则多用于文件上传,如下:

1

2

<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:

1

cnpm install body-parser --save

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

1

2

3

4

5

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

1

2

3

app.post("/",urlencodedParser,function(req,res){

    res.send(req.body);

});

  

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<!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:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

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请求的数据,先安装

1

cnpm install connect-multiparty --save

  再引入和构建函数:

1

2

3

4

5

6

7

8

9

const multipart = require('connect-multiparty');

var multipartMiddleware = multipart();

```

同样我们也采用req.body来获取参数:

```

app.post('/',multipartMiddleware,function(req,res){

    res.send(req.body);

});

  完整的:

1

2

3

4

5

6

7

8

9

10

11

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系列教程八: Spring实现事务的两种方式

    2019独角兽企业重金招聘Python工程师标准>>> 一. Spring事务概念: 事务是一系列的动作,它们综合在一起才是一个完整的工作单元,这些动作必须全部完成,如果有一个失败的 ...

  2. html中获取modelandview中的json数据_从Bitmap中获取YUV数据的两种方式

    从Bitmap中我们能获取到的是RGB颜色分量,当需要获取YUV数据的时候,则需要先提取R,G,B分量的值,然后将RGB转化为YUV(根据具体的YUV的排列格式做相应的Y,U,V分量的排列) 所以这篇 ...

  3. 织梦 php 传值,php获取post参数的几种方式

    php获取post参数的几种方式,ajax提交数据的几种类型,PHP默认识别的数据类型是application/x-www.form-urlencoded标准的数据类型. 1.$_POST['para ...

  4. Spark-Streaming获取kafka数据的两种方式-Receiver与Direct的方式

    Spark-Streaming获取kafka数据的两种方式-Receiver与Direct的方式,可以从代码中简单理解成Receiver方式是通过zookeeper来连接kafka队列,Direct方 ...

  5. Android获取IP地址的两种方式(准确版)

    原文:https://blog.csdn.net/sinat_16458039/article/details/50260589 最近看了好多网上获取IP地址的例子,发现好多都不完全准确,这里我写一下 ...

  6. Flink获取外部传递参数的两种方式

    目录 一.前言 二.实现 2.1 通过参数方式直接传递 2.2 通过配置文件来获取参数值 一.前言 在Flink中,我们会对接Kafka,Kafka的参数比较多,如果我们希望通过灵活的方式修改参数,而 ...

  7. iOS 通过URL网络获取XML数据的两种方式

    下面简单介绍如何通过url获取xml的两种方式. 第一种方式相对简单,使用NSData的构造函数dataWithContentsOfURL:不多解释,直接上代码咯. NSURL *url = [NSU ...

  8. maven web项目导入sts_Spring Boot2 系列教程(二)创建 Spring Boot 项目的三种方式

    我最早是 2016 年底开始写 Spring Boot 相关的博客,当时使用的版本还是 1.4.x ,文章发表在 CSDN 上,阅读量最大的一篇有 43W+,如下图: 2017 年由于种种原因,就没有 ...

  9. springboot 获取控制器参数的几种方式

    这里介绍springboot 获取控制器参数有四种方式 1.无注解下获取参数 2.使用@RequestParam获取参数 3.传递数组 4.通过URL传递参数 无注解下获取参数 无注解下获取参数,需要 ...

最新文章

  1. 【蓝桥java】递归基础之车辆进出栈
  2. POJ 1185 炮兵阵地 (状压DP)
  3. 你不懂js系列学习笔记-类型与文法- 04
  4. 苹果8如何设置锁屏无线网连接服务器,iPhone8屏幕解锁怎么设置?苹果iPhone8与8 Plus解锁四种方法...
  5. CMAKE_CURRENT_BINARY_DIR
  6. c++ 跳转到上级目录_Windows漏洞利用开发 第4部分:使用跳转定位Shellcode 模块
  7. python中if __name__ == ‘__main__‘:的简单理解
  8. 令新手头痛的java.lang.ClassNotFoundException: org.springframework.web.servlet.DispatcherServlet错误...
  9. SQL-SERVER2008登录错误233
  10. Django组件--cookie与session
  11. layer + ajax 弹出框
  12. 苹果谷歌双双被曝,你的手机正在窃听你的生活
  13. [BZOJ4523]路由表
  14. 小黑相关预搞书籍杂志等
  15. 性能分析工具System Trace
  16. 【数据结构06】二叉平衡树(AVL树)
  17. SAP库存分析(MC.9) (转)
  18. android 生成bks_Android 添加 证书(pem,crt,p12,bks,jks)到 keystore.bks
  19. ASP.NET设置404错误页面
  20. 如何在Windows 10上退出安全模式

热门文章

  1. 【翻译】Sencha Ext JS 5发布
  2. 周志华西瓜书笔记——第一章
  3. 【MM32F5270开发板试用】移植Google Chrome小恐龙游戏到MM32F5270
  4. 微信第三方平台开发经验总结(四):重定向到授权页
  5. 【FME】不规则图形生成四至点坐标
  6. python-02 总结
  7. 有人参加过CSDN超级实习生计划吗?靠谱吗?
  8. JAVA获取某个日期上个月的最后一天
  9. 海亮Day2:差分约束、拓扑排序、欧拉路
  10. sharepoint 2016 学习系列篇(23)-文档库应用篇-(5)文档权限配置