前言

我们都知道在node.js中,我们最常用的请求方式是get和post。其中get请求和URL相关,通过解析URL我们可以直接获取到请求的参数。但是post请求不同,post请求是包含在请求体中,node.js并没有一个模块可以用来获取请求体(因为post传输的是较大的数据,不知道什么时候请求完成,也就无法通过模块来进行获取),因此,post请求不能直接获取到,我们获取post内容需要手动通过监听来实现。基本语法结构如下:

var http = require('http');
var querystring = require('querystring'); http.createServer(function(req, res){
// 定义了一个post变量,用于暂存请求体的信息
var post = '';
// 通过req的data事件监听函数,每当接受到请求体的数据,就累加到post变量中
req.on('data', function(chunk){
post += chunk;
});
// 在end事件触发后,通过querystring.parse将post解析为真正的POST请求格式,然后向客户端返回。
req.on('end', function(){
post = querystring.parse(post);
res.end(util.inspect(post));
});
}).listen(3000);

从上面我们可以知道,要获取到post中的数据,需要通过监听data和end事件。每次进行post请求时,都需要手动监听就非常麻烦了,而formidable就能够帮助我们简化这个过程

formidable的使用

我们使用简单的表单进行post提交,使用formidable来进行post的处理。

对应的前端代码如下:

<form action="/student" >
<p>
学号:<input type="text" name ='sid' id="sid">
</p>
<p>
姓名:<input type="text" name ='name' id="sid">
</p>
<p>
<input type="submit" value="submit" id="btn">
</p>
</form>
//使用jquery的post进行表单提交
<script>
$('#btn').click(function(){
$.post('/student',{
sid:$('input[name=sid]').val(),
name:$('input[name=name]').val()
},function(){})
})
</script>

1. 下载并且引入

npm i formidable --save
const formidable = require('formidable')

2.在路由中使用

//post路由
app.post('/student',(req,res) => {
//创建一个form对象
const form = new formidable.IncomingForm();
//使用form.parse进行接收
form.parse(req,function(err,fields,files){
console.log(fields);
});
});
```
从上面的代码中,我们可以看到formidable的使用非常简单。
1. 创建一个form对象
2. 使用form.parse()函数接收数据,其中回调函数中的fields是接收的数据。我们观察刚刚表格传递过来的数据。
正好是学号和姓名组成的json数据。也就是说我们使用formidable顺利接收了post请求的内容。

注意:进行post请求时,肯定需要对应的请求路径(在Node中就是路由),因此formidable的使用一定是在app.post路由中。

 使用post上传文件

我们上面使用了fomidable.parse(req,function(err,fields,files){}),说到了其中回调函数中的fields是接收表单传递过来的数据,但是但是我们并没有说第三个参数files。从字面意思来看files就是文件的意思,在这里就是上传文件。其实formidable还具有另外一个非常重要的功能,那就是上次文件或者图片。

同样我们进行简单的上传文件操作:

formidable上传文件的使用和进行表单接收数据的使用方法基本相同,但是这里有两个非常重要的区别:

1. form中必须设置enctype以及表单中的上传控件必须设置name属性。

//form中必须有enctype属性
<form action="/student" enctype="multipart/form-data" method="post">
<p>
<input type="file" name="fileUpload"> //这里必须有name属性
</p>
<p>
<input type="submit" value="上传" id="btn2">
</p>
</form>

2. 使用form.parse前必须设置保存地址

app.post('/student',(req,res) => {
const form = new formidable.IncomingForm();
//必须设置保存地址
form.uploadDir = "./upload";
form.parse(req,function(err,fields,files){
console.log(files);
res.send('');
});
});

我们观察文件是否被上传成功。

我们可以看到上传的文件变成了一个随机命名的不带扩展名的文件。
我们可以设置添加它的扩展名:

form.keepExtensions = true;

这样就能够得到带扩展名的文件:

同时我们还可以进行更多的设置,具体的可以参考npm官网。

总结
formidable插件主要有两个重要功能:

  1.  处理Node.js中的post请求(通常是表单请求时使用)
  2.  进行文件或者图片的上传(在Node.js中用得非常多)

formidable处理node.js的post请求的更多相关文章

  1. Node.js GET/POST请求

    在很多场景中,我们的服务器都需要跟用户的浏览器打交道,如表单提交. 表单提交到服务器一般都使用GET/POST请求. 我将为大家介绍 Node.js GET/POST请求. 获取GET请求内容 由于G ...

  2. node.js 发送http 请求

    自己研究了一下 node.js 的 http模块  下面为想服务器发送请求的代码 ,通过学习了解http 请求的过程 ,node.js 对http请求的原始封装比较低,以前php 可以用$_GET , ...

  3. body-parser Node.js(Express) HTTP请求体解析中间件

    body-parser Node.js(Express) HTTP请求体解析中间件 2016年06月08日     781     声明 在HTTP请求中,POST.PUT和PATCH三种请求方法中包 ...

  4. 关于Node.js的httpClieint请求报错ECONNRESET的原因和解决措施

    背景说明 最近在工作项目中有下面一个场景: 使用Node.js的express框架实现了一个文件系统服务器端,其中有个API用于客户端上传文件.客户端使用Node.js的HttpClient来调用服务 ...

  5. node.js搭建代理服务器请求数据

    1.引入node.js中的模块 var http = require("http"); var url = require("url"); var qs = r ...

  6. 35.Node.js GET/POST请求

    转自:http://www.runoob.com/nodejs/nodejs-module-system.html 在很多场景中,我们的服务器都需要跟用户的浏览器打交道,如表单提交. 表单提交到服务器 ...

  7. node.js处理post请求

    1.html 2.app.js var http = require('http') var qs = require('querystring') /** * 路由控制的功能 * @param pa ...

  8. Node.js + Express 接口请求(GET、POST、PUT)事例

    路由 路由是指应用程序的端点(URI)如何响应客户端请求.有关路由的介绍,请参阅基本路由. 您可以使用Express app对象的方法定义路由,这些方法对应于HTTP方法; 例如,app.get()处 ...

  9. 关于Node.js中HTTP请求返回数据需要JSON解析的问题

    在编写项目过程中,需要用到实时数据的推送需求, 所以首先想到了NodeJS的websocket模块 在网上找了一个聊天室的例子  然后将其改为自己需求的推送 其中遇到的问题 返回数据问题  :   由 ...

随机推荐

  1. nltk download失败

    之前在台式机win10的系统,python 2.7,用的pycharm执行nltk download(),很顺利.然而到了我的笔记本只是换个一个win8的系统,Python的配置都是一样的,但是这时候 ...

  2. C#读取shp文件并获取图形保存到sde要素类中(不使用ESRI的类库,纯c#实现)

    说明:首先要将sde要素类发布成对应的要素服务,通过对要素服务的操作,实现数据在sde要素类中的增删 //向服务器发出请求 public string getPostData(string postS ...

  3. Net Core 生成图形验证码

    1. NetCore ZKweb       在我第一次绘制图形验证码时是采用的ZKweb的绘制库,奉上代码参考      public byte[] GetVerifyCode(out string ...

  4. 修改ZendStudio新建php文件时的模板

    zendstudio默认的模板不适用,可以自己到Window -- preferences -- php -- code style -- code templates -- code -- samp ...

  5. js基础进阶--图片上传时实现本地预览功能的原理

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...

  6. 不使用JavaScript实现菜单的打开和关闭

    我在写有菜单栏的网页时,基本都会用响应式设计来适配移动端,例如把不重要的菜单选项隐藏,或者创建一个菜单按钮来控制的菜单的打开和关闭之类的.而我之前一直是使用JavaScript来实现菜单的打开和关闭的 ...

  7. CXF整合spring

    近公司需要弄webservics,还说不用框架整合(提倡使用hessian,他们既然说与操作系统有兼容问题,由于人员单薄,不得不屈服,哎),我想了老半天没弄明白他说的不用框架整合spring,尝试过直 ...

  8. SQL语句的CRUD

    一.基础 .说明:创建数据库 CREATE DATABASE database-name .说明:删除数据库 drop database dbname .说明:备份sql server --- 创建 ...

  9. PAT1028:List Sorting

    1028. List Sorting (25) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Excel ca ...

  10. java并发包java.util.concurrent详解

    线程池ThreadPoolExecutor的使用 并发容器之CopyOnWriteArrayList 并发容器之CopyOnWriteArraySet 数据结构之ConcurrentHashMap,区 ...