美文网首页IT@程序员猿媛
Express全系列教程之(四):获取Post参数的两种方式

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

作者: 蓝袍小将 | 来源:发表于2019-04-08 21:22 被阅读0次

一、关于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参数的两种方式

    一、关于POST请求 post方法作为http请求很重要的一部分,几乎所有的网站都有用到它,与get不同,post...

  • Gin-获取POST请求参数

    有默认值方式获取POST请求参数 无默认值方式获取POST请求参数 获取POST请求参数的同时,返回参数获取状态,...

  • Node.js进阶之【9】 : express模块获取post数

    一、express模块获取post数据 1) express模块获取客户端通过 【post】发过来的数据,需要中间...

  • NODEJS问题总结

    一、1.Express获取路由地址参数的方法主要有两种方式:req.query(req.body)和req.par...

  • express获取参数GET和POST

    req.query: 处理 get 请求 req.params: 处理 /:xxx 形式的 get 请求 req....

  • get、post

    网络请求的两种常用方式为get和post get 语义是获取指定URL上的资源所有参数拼接到URL后面,动作与参数...

  • express获取url参数

    express获取url参数有三种方式1 req.params[参数]获取客户端get方式传递过来的值,如rout...

  • gf框架请求

    获取GET请求参数 Server: 执行请求: 获取POST请求参数 执行请求: 获取任意提交方式的请求数据 执行...

  • Lua参数获取方法

    POST参数获取 JSON参数获取 GET参数获取

  • http协议,tcp/udp汇总

    GET和POST请求方式的区别? get获取数据,post发送数据 get拼接URL后面,post参数放在body...

网友评论

    本文标题:Express全系列教程之(四):获取Post参数的两种方式

    本文链接:https://www.haomeiwen.com/subject/iilmiqtx.html