经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » JS/JS库/框架 » Node.js » 查看文章
formidable处理node.js的post请求
来源:cnblogs  作者:海因斯坦  时间:2019/4/29 9:03:20  对本文有异议

前言

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

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

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

formidable的使用

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

对应的前端代码如下:

  1. <form action="/student" >
  2. <p>
  3. 学号:<input type="text" name ='sid' id="sid">
  4. </p>
  5. <p>
  6. 姓名:<input type="text" name ='name' id="sid">
  7. </p>
  8. <p>
  9. <input type="submit" value="submit" id="btn">
  10. </p>
  11. </form>
  12. //使用jquery的post进行表单提交
  13. <script>
  14. $('#btn').click(function(){
  15. $.post('/student',{
  16. sid:$('input[name=sid]').val(),
  17. name:$('input[name=name]').val()
  18. },function(){})
  19. })
  20. </script>

1. 下载并且引入

  1. npm i formidable --save
  2. const formidable = require('formidable')

2.在路由中使用

  1. //post路由
  2. app.post('/student',(req,res) => {
  3. //创建一个form对象
  4. const form = new formidable.IncomingForm();
  5. //使用form.parse进行接收
  6. form.parse(req,function(err,fields,files){
  7. console.log(fields);
  8. });
  9. });
  10. ```
  11. 从上面的代码中,我们可以看到formidable的使用非常简单。
  12. 1. 创建一个form对象
  13. 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属性。

 

  1. //form中必须有enctype属性
  2. <form action="/student" enctype="multipart/form-data" method="post">
  3. <p>
  4. <input type="file" name="fileUpload"> //这里必须有name属性
  5. </p>
  6. <p>
  7. <input type="submit" value="上传" id="btn2">
  8. </p>
  9. </form>

 

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

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

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

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

  1. form.keepExtensions = true;

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

 

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

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

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

 

原文链接:http://www.cnblogs.com/yinhaiying/p/10785221.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号