node.js文件上传处理示例


Posted in Javascript onOctober 27, 2016

直入主题,在Node.js web 开发基本框架的前提下,我们来做一个文件上传功能

上传的handler比较简单,网上都能找到

var url=require('url');
var exec=require('child_process').exec;
var querystring=require('querystring');

/********************************文件上传 第3方模块测试*************************/
function fileUploadForm(request,response){
 response.writeHead(200,{'Content-Type':'text/html'});
 var body = '<html>'+
  '<head>'+
  '<meta http-equiv="Content-Type" '+
  'content="text/html; charset=UTF-8" />'+
  '</head>'+
  '<body>'+
  '<form action="/fileuploadaction" method="post" enctype="multipart/form-data">'+
  '<input name="name" type="text" />'+
  '<input name="upload" type="file" />'+
  '<input type="submit" value="Upload" />'+
  '</form>'+
  '</body>'+
  '</html>';
 response.write(body);
 response.end();
}

<span style="color: rgb(255, 0, 0);">function fileUploadAction(request,response){
 var fs=require('fs');
 var formidable=require('formidable');
 var baseUploadPath="./media/upload/";
 var form=new formidable.IncomingForm();
 form.uploadDir='./var/tmp';
 form.parse(request,function(error,fields,files){
  if(!error){
   console.log(fields);
   var desUploadName=baseUploadPath+files.upload.name;
   fs.renameSync(files.upload.path, desUploadName);
   response.writeHead(200,{'Content-Type':'text/html'});//值得注意的是这里的response.writeHead()函数内容要写在form.parse()的callback中要不不会显示
   response.write('received image:</br>');
   response.write('<img src="/showuploadimage?name='+files.upload.name+'" />');
   response.end();
  }
 });
}</span>

function showUploadImage(request,response){
 var fs=require('fs');
 var imageName=querystring.parse(url.parse(request.url).query);
 var baseUploadPath="./media/upload/";
 fs.readFile(baseUploadPath+imageName.name, "binary", function(error, file) {
  if(error) {
   response.writeHead(500, {"Content-Type": "text/plain"});
   response.write(error + "\n");
   response.end();
  } else {
   response.writeHead(200, {"Content-Type": "image/png"});
   response.write(file, "binary");
   response.end();
  }
 });
}
exports.fileuploadform=fileUploadForm;
exports.fileuploadaction=fileUploadAction;
exports.showuploadimage=showUploadImage;

同时在index.js中添加

handle['/fileuploadform']=handlers.fileuploadform; 
handle['/fileuploadaction']=handlers.fileuploadaction; 
handle['/showuploadimage']=handlers.showuploadimage;

有一点需要注意的是,在有需要处理文件上传的时候,不能在server中添加

request.setEncoding('utf8');//设置这个很可能导致上传失败,这是formidable模块的一个bug吧


request.addListener("data",function(tempPostData){ 
   postData+=tempPostData; 
  }); 
  request.addListener("end",function(){ 
   route(request,response,postData,handle); 
  });

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript事件问题
Sep 05 Javascript
jQuery学习笔记之基础中的基础
Jan 19 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
Jun 14 Javascript
jquery实现表单验证简单实例演示
Nov 23 Javascript
微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例
Oct 13 Javascript
分享vue.js devtools遇到一系列问题
Oct 24 Javascript
利用vue + element实现表格分页和前端搜索的方法
Dec 25 Javascript
js+html5实现手机九宫格密码解锁功能
Jul 30 Javascript
webpack4打包vue前端多页面项目
Sep 17 Javascript
微信小程序购物车、父子组件传值及calc的注意事项总结
Nov 14 Javascript
微信小程序如何调用图片接口API并居中显示
Jun 29 Javascript
vue学习笔记之Vue中css动画原理简单示例
Feb 29 Javascript
Vue.js表单控件实践
Oct 27 #Javascript
vue实现可增删查改的成绩单
Oct 27 #Javascript
vuex实现简易计数器
Oct 27 #Javascript
微信小程序  生命周期详解
Oct 27 #Javascript
require.js+vue开发微信上传图片组件
Oct 27 #Javascript
Javascript将字符串日期格式化为yyyy-mm-dd的方法
Oct 27 #Javascript
vue开发心得和技巧分享
Oct 27 #Javascript
You might like
PHP仿盗链代码
2012/06/03 PHP
php数据结构与算法(PHP描述) 查找与二分法查找
2012/06/21 PHP
手把手教你打印出PDF(关于fpdf的简单应用)
2013/06/25 PHP
PHP实现图片压缩的两则实例
2014/07/19 PHP
ThinkPHP项目分组配置方法分析
2016/03/23 PHP
Thinkphp单字母函数使用指南
2016/05/08 PHP
php 使用 __call实现重载功能示例
2019/11/18 PHP
THINKPHP-Apache服务器中使用Alias虚拟目录URL重写 隐藏index.php
2021/03/09 PHP
javascript数组的扩展实现代码集合
2008/06/01 Javascript
javascript 防止刷新,后退,关闭
2010/08/07 Javascript
javascript中取前n天日期的两种方法分享
2014/01/26 Javascript
修复jQuery tablesorter无法正确排序的bug(加千分位数字后)
2016/03/30 Javascript
jQuery使用$.each遍历json数组的简单实现方法
2016/04/18 Javascript
深入理解setTimeout函数和setInterval函数
2016/05/20 Javascript
详解vue.js的devtools安装
2017/05/26 Javascript
实现微信小程序的wxml文件和wxss文件在webstrom的支持
2017/06/12 Javascript
Nuxt.js实战详解
2018/01/18 Javascript
vue+springboot实现项目的CORS跨域请求
2018/09/05 Javascript
vue+django实现一对一聊天功能的实例代码
2019/07/17 Javascript
解决layui动态添加的元素click等事件触发不了的问题
2019/09/20 Javascript
[02:16]2018年度CS GO最具人气选手-完美盛典
2018/12/16 DOTA
Python封装shell命令实例分析
2015/05/05 Python
python使用socket创建tcp服务器和客户端
2018/04/12 Python
浅谈Python中的全局锁(GIL)问题
2019/01/11 Python
使用python进行广告点击率的预测的实现
2019/07/04 Python
真正了解CSS3背景下的@font face规则
2017/05/04 HTML / CSS
Backcountry旗下的户外商品闪购网站:steep&cheap
2016/09/22 全球购物
工商管理实习自我鉴定
2013/09/28 职场文书
电子商务应届生求职信
2013/11/16 职场文书
《花木兰》教学反思
2014/04/09 职场文书
酒店管理专业毕业生自我鉴定
2014/09/29 职场文书
2015年乡镇平安建设工作总结
2015/05/13 职场文书
安全教育的主题班会
2015/08/13 职场文书
mysql优化之query_cache_limit参数说明
2021/07/01 MySQL
室外天线与收音机天线杆接合方法
2022/04/05 无线电
MySQL 原理与优化之Update 优化
2022/08/14 MySQL