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 相关文章推荐
filemanage功能中用到的lib.js
Apr 08 Javascript
JavaScript实现按Ctrl键打开新页面
Sep 04 Javascript
AngularJS中$interval的用法详解
Feb 02 Javascript
jQuery防止重复绑定事件的解决方法
May 14 Javascript
BootStrap入门教程(一)之可视化布局
Sep 19 Javascript
Node.js中的require.resolve方法使用简介
Apr 23 Javascript
react实现换肤功能的示例代码
Aug 14 Javascript
微信小程序页面传多个参数跳转页面的实现方法
May 17 Javascript
Vue+webpack实现懒加载过程解析
Feb 17 Javascript
浅析TypeScript 命名空间
Mar 19 Javascript
微信小程序实现签到弹窗动画
Sep 21 Javascript
使用Mock.js生成前端测试数据
Dec 13 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中使用FFMPEG获取视频缩略图和视频总时长实例
2014/05/04 PHP
PHP基于工厂模式实现的计算器实例
2015/07/16 PHP
php简单判断文本编码的方法
2015/07/30 PHP
php判断str字符串是否是xml格式数据的方法示例
2017/07/26 PHP
PHP设计模式之注册树模式分析
2018/01/26 PHP
javascript addBookmark 加入收藏 多浏览器兼容
2009/08/15 Javascript
JS动态添加option和删除option(附实例代码)
2013/04/01 Javascript
[JSF]使用DataModel处理表行事件的实例代码
2013/08/05 Javascript
jquery实现网页查找功能示例分享
2014/02/12 Javascript
javascript处理a标签超链接默认事件的方法
2015/06/29 Javascript
jQuery中 delegate使用的问题
2015/07/03 Javascript
jQuery Ajax页面局部加载方法汇总
2016/06/02 Javascript
jQuery dataTables与jQuery UI 对话框dialog的使用教程
2016/09/02 Javascript
深入浅析Vue组件开发
2016/11/25 Javascript
js 获取图像缩放后的实际宽高,位置等信息
2017/03/07 Javascript
JavaScript模拟文件拖选框样式v1.0的实例
2017/08/04 Javascript
vue-cli与webpack处理静态资源的方法及webpack打包的坑
2018/05/15 Javascript
vue-cli 3.0 自定义vue.config.js文件,多页构建的方法
2018/09/19 Javascript
Angular父子组件通过服务传参的示例方法
2018/10/31 Javascript
vue中利用simplemde实现markdown编辑器(增加图片上传功能)
2019/04/29 Javascript
JavaScript单线程和任务队列原理解析
2020/02/04 Javascript
Python3使用requests包抓取并保存网页源码的方法
2016/03/15 Python
python线程池(threadpool)模块使用笔记详解
2017/11/17 Python
python实现大转盘抽奖效果
2019/01/22 Python
python读写csv文件方法详细总结
2019/07/05 Python
pytorch 自定义参数不更新方式
2020/01/06 Python
python GUI库图形界面开发之PyQt5下拉列表框控件QComboBox详细使用方法与实例
2020/02/27 Python
MyFrenchPharma中文网:最大的法国药妆平台
2016/10/07 全球购物
Superdry瑞典官网:英国日本街头风品牌
2017/05/17 全球购物
介绍一下结构化程序设计方法和面向对象程序设计方法的区别
2012/06/27 面试题
尽职尽责村干部自我鉴定
2014/01/23 职场文书
品质主管岗位职责
2014/03/16 职场文书
扩大国家免疫规划实施方案
2014/03/21 职场文书
医学求职信
2014/05/28 职场文书
2015年国庆节标语大全
2015/07/30 职场文书
科学家测试在太空中培育人造肉,用于未来太空旅行
2022/04/29 数码科技