express的中间件bodyParser详解


Posted in Javascript onDecember 04, 2014

bodyParser用于解析客户端请求的body中的内容,内部使用JSON编码处理,url编码处理以及对于文件的上传处理.

下面是一个文件上传的例子.

建立一个1.html页面

 <!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title>向服务器上传文件</title>

     <script type="text/javascript">        

         function uploadFile(){

             var formData=new FormData();

             var files=document.getElementById("files").files;

             var file=files[0];

             formData.append("myfile",file);

             var xhr=new XMLHttpRequest();

             xhr.open("post","index.html",true);

             xhr.onload= function (e) {

                 if(this.status==200)

                     document.getElementById("result").innerHTML=this.response;

             };

             xhr.send(formData);

         }

     </script>

 </head>

 <body>

 请选择文件:<input type="file" id="files" name="file" />

 <input type="button" value="上传文件" onclick="uploadFile();" />

 <div id="result"></div>

 </body>

 </html>

上面的XMLHttpRequest对象与FormData对象时HTML5中的内容,不作重点讲解.用这两个对象可以将用户选取的文件上传到服务器端,.

在服务器端使用了app.use(express.bodyParser())中间件之后,代表客户端请求的http.IncomingMessage,也就是res对象就具有了一个files属性.

server.js端代码:

 var express=require("express");

 var fs=require("fs");

 var app=express();

 app.use(express.bodyParser());

 app.get("/index.html", function (req,res) {

     res.sendfile(__dirname+"/1.html");

 });

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

     var file=req.files.myfile;

     fs.readFile(file.path, function (err,data) {

         if(err) res.send("读文件操作失败");

         else{

             fs.writeFile(file.name,data, function (err) {

                 if(err) res.send("写文件操作失败.");

                 else res.send("文件上传成功");

             })

         }

     });

 });

 

 

 app.listen(1337,"127.0.0.1", function () {

     console.log("开始监听");

 });

启动服务器后,运行浏览器:

express的中间件bodyParser详解

选择文件:

express的中间件bodyParser详解

在浏览器端出现了 上传成功字样,

在服务器端也有了我们上传的文件.

express的中间件bodyParser详解

点击上传后:

另外bodyParse可以接受客户端ajax提交的json数据,以及url的处理.

Javascript 相关文章推荐
基于Jquery的实现回车键Enter切换焦点
Sep 14 Javascript
JavaScript function函数种类详解
Feb 22 Javascript
jquery-mobile表单的创建方法详解
Nov 23 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
Aug 23 Javascript
Vue中v-show添加表达式的问题(判断是否显示)
Mar 26 Javascript
原生实现一个react-redux的代码示例
Jun 08 Javascript
angularJs中$scope数据序列化的实例
Sep 30 Javascript
JS实现的字符串数组去重功能小结
Jun 17 Javascript
通过JQuery,JQueryUI和Jsplumb实现拖拽模块
Jun 18 jQuery
微信小程序开发常见问题及解决方案
Jul 11 Javascript
ES6 Iterator遍历器原理,应用场景及相关常用知识拓展详解
Feb 15 Javascript
javascript实现搜索筛选功能实例代码
Nov 12 Javascript
express的中间件basicAuth详解
Dec 04 #Javascript
详解JS函数重载
Dec 04 #Javascript
如何让你的Lightbox支持滚轮缩放及Base64图片
Dec 04 #Javascript
javascript常用代码段搜集
Dec 04 #Javascript
5种处理js跨域问题方法汇总
Dec 04 #Javascript
用js读、写、删除Cookie代码续篇
Dec 03 #Javascript
js字符串完全替换函数分享
Dec 03 #Javascript
You might like
星际争霸中的对战模式介绍
2020/03/04 星际争霸
dedecms中显示数字验证码的修改方法
2007/03/21 PHP
php chr() ord()中文截取乱码问题解决方法
2008/09/08 PHP
php函数指定默认值方法的小例子
2013/12/04 PHP
Yii2.0预定义的别名功能小结
2016/07/04 PHP
Yii框架实现邮箱激活的方法【数字签名】
2016/10/18 PHP
thinkphp中AJAX返回ajaxReturn()方法分析
2016/12/06 PHP
json格式的时间显示为正常年月日的方法
2013/09/08 Javascript
基于豆瓣API+Angular开发的web App
2015/01/02 Javascript
折叠菜单及选择器的运用
2017/02/03 Javascript
Angular实现跨域(搜索框的下拉列表)
2017/02/16 Javascript
JS数组操作中的经典算法实例讲解
2017/07/26 Javascript
vue中使用localstorage来存储页面信息
2017/11/04 Javascript
微信小程序select下拉框实现源码
2019/11/08 Javascript
create-react-app中添加less支持的实现
2019/11/15 Javascript
微信小程序8种数据通信的方式小结
2020/02/03 Javascript
JavaScript对象字面量和构造函数原理与用法详解
2020/04/18 Javascript
微信小程序国际化探索实现(附源码地址)
2020/05/20 Javascript
vue created钩子函数与mounted钩子函数的用法区别
2020/11/05 Javascript
[06:01]刀塔次级联赛top10第一期
2014/11/07 DOTA
详解Django中的form库的使用
2015/07/18 Python
Python验证企业工商注册码
2015/10/25 Python
pandas 透视表中文字段排序方法
2018/11/16 Python
基于django ManyToMany 使用的注意事项详解
2019/08/09 Python
VSCode配合pipenv搞定虚拟环境的实现方法
2020/05/17 Python
HTML5中图片之间的缝隙完美解决方法
2017/07/07 HTML / CSS
Giglio德国网上精品店:奢侈品服装和配件
2016/09/23 全球购物
经济实惠的名牌太阳镜和眼镜:Privé Revaux
2021/02/07 全球购物
大学生自我鉴定范文
2013/12/28 职场文书
大学生职业规划论文
2014/01/11 职场文书
知识竞赛主持词
2014/03/26 职场文书
职业生涯规划书结束语
2014/04/15 职场文书
日语专业毕业生自荐书
2014/06/18 职场文书
婚礼新人答谢词
2015/01/04 职场文书
测量JavaScript函数的性能各种方式对比
2021/04/27 Javascript
撤回我也能看到!教你用Python制作微信防撤回脚本
2021/06/11 Python