node.js文件上传处理示例_node.js

直入主题,在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);
  }); 

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

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索nodejs
文件上传
nodejs处理图片上传、nodejs 处理文件上传、nodejs demo 示例、node.js demo示例下载、node.js web开发示例,以便于您获取更多的相关知识。

时间: 2024-09-25 11:52:32

node.js文件上传处理示例_node.js的相关文章

Node.js实现兼容IE789的文件上传进度条_node.js

Nodejs对文件上传的处理 在Express4里req.files已经是undefined了:现在用的最多的可能就是formidable了,你知道了它有个progress事件,于是心中大喜,低版本IE的进度条有戏了:OK,试一下: form .on('error',function(err){ console.log(err); }) .on('aborted',function(){ console.log('aborted'); }) .on('progress',function(byt

codeigniter多文件上传使用示例

 这篇文章主要介绍了codeigniter多文件上传使用示例,需要的朋友可以参考下 代码如下: <?php if(!defined("BASEPATH")){ exit("No direct script access allowed"); }    /**   * Multi-Upload   *    * Extends CodeIgniters native Upload class to add support for multiple   * upl

php多文件上传下载示例分享

 这篇文章主要介绍了php多文件上传下载示例,需要的朋友可以参考下  代码如下: <html> <head>     <meta charset="utf-8">     <title>index_uploads</title> </head> <body>     <form action="uploads.php" method="post" encty

代码-ajaxfileupload.js文件上传SecurityError:Blocked

问题描述 ajaxfileupload.js文件上传SecurityError:Blocked 1C 采用ajaxfileupload.js这个插件配合jquery-1.8.0.min.js多文件上传,在本地测试没问题,发上生产时,报:SecurityError:Blocked a frame with origin""https://31.0.3.4""from accessing a cross-originframe.客户那边https://31.0.3.4是

js 多文件上传-ajaxfileupload.js 文件上传

问题描述 ajaxfileupload.js 文件上传 ajaxfileupload.js 第一次上次没问题 第二次获取不到文件 clone(true); 在网上查找了一下 添加了 true也没有用 求大神指点! 解决方案 ajaxfileupload.js 文件上传插件之改进ajaxfileupload 文件上传ajaxfileupload.js+springMVC实现无刷新文件上传 解决方案二: http://blog.csdn.net/zhanglu201112/article/detai

Angular Js文件上传之form-data_javascript技巧

前言:很久没更新博客,最近公司pc端技术选型用angular,这几天就赶鸭子上架,硬着头皮直接上手angular.其中有许多小坑陆陆续续踩起走.今天就遇到一个比较常见的问题:图片上传. 主题:图片上传服务器,然后通过服务器传阿里云. 不废话了直接贴前端代码: $http({ method: 'POST', url: '/wechatapp/User/setAvatar', data: data, headers: { 'Content-Type': undefined }, transformR

分享一个.NET版的多选文件上传操作示例

文件上传,无刷新上传,文件批量上传,批量无刷新上传,这些词这年头好像非常多,不管那种上传能满足实际的需求就是好的,一般上传文件时,点文件浏览框,只能选 择单个文件,如果要上传多个,浏览多次,然后点击批量上传就可以了,也很好的,也不刷新也有进度显示,完全不错的.网上也有关于上传文件的能够多选的例子,点浏 览时可以按住ctrl键或者shift键选择多个,然后上传.但是好像这样的.NET版的不多,朋友发我一个整理过的Demo,之后我又稍微整理了下,觉得还好,可以分享给大家一 下,好与不好就不说,因为没

js获取上传文件大小示例代码

 js获取上传文件大小在ie下要改安全设置中的对为标记为可安全执行脚本的ActiveX空间初始化并执行,需要的朋友可以参考下 代码如下:  在ie下,貌似要改安全设置中的[对为标记为可安全执行脚本的ActiveX空间初始化并执行]那项     代码如下: <html>  <head>  <script type="text/javascript">  var isIE = /msie/i.test(navigator.userAgent) &

JS文件上传神器bootstrap fileinput详解_javascript技巧

Bootstrap FileInput插件功能如此强大,完全没有理由不去使用,但是国内很少能找到本插件完整的使用方法,于是本人去其官网翻译了一下英文说明文档放在这里供英文不好的同学勉强查阅.另外附上一段调用方发和servlet端的接收代码,未完待续. 引言: 一个强化的HTML5 文件输入插件,适用于Bootstrap 3.x.本插件对多种类型的文件提供文件预览,并且提供了多选等功能.本插件还提供给你一个简单的方式去安装一个先进的文件选择/上传控制版本去配合Bootstrap CSS3样式.通过