分享一个node结合uploadify的异步上传例子。
发布于 2年前 作者 fyddaben 1718 次浏览

服务器端配置: app.js==> app.use(express.bodyParser({ keepExtensions: true, uploadDir: __dirname + '/public/upload'})); index.js==>

`exports.upload = function(req, res){

     var fileDesc=req.files;

 var imgname=fileDesc.Filedata.name;
 
     var path=fileDesc.Filedata.path;//这里是本地路径D://upload/..jpg
 
     var index=path.indexOf(constant.uploadFile);//配置的放置文件的文件夹名字
 
     var name=path.substring(index);
 
 var imgurl=constant.DomainUrl+":"+constant.DomainPort+"/"+name;
 
 res.send(imgurl);//返回服务器端地址

};`

前台配置: test.js==>

$(function() {
    $('#file_upload').uploadify({
         'swf'     : '/images/uploadify.swf',
         'formData':{
                'userid':'用户id',
                'username':'用户名',
                'rnd':'加密密文'
          },
          'cancelImg ':'/images/uploadify-cancel.png',
          'fileTypeExts' : '*.gif; *.jpg; *.png',
          'simUploadLimit ':'2',
          'uploader' : '/fileupload',
          'onUploadSuccess' : function(file, data, response) {
                  var img="<img src=\""+data+"\"/>";
                
                              $("#img_box").append(img);
                }
    });
});

html页面:

<link rel="stylesheet" type="text/css" href="/stylesheets/uploadify.css">
<style type="text/css">
    .input_frame{
        height: 70px;
    }
    .img{
        width: 550px;
        position: absolute;
        margin-top: 50px;
    }
    .img img{
        width: 100px;
        height: 100px;
        margin-left: 10px;
        z-index: -99;
    }
</style>

<div class="input_frame">
   <pre><input type="file" name="file_upload" id="file_upload" /></pre>
      </div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="/javascripts/jquery.uploadify.min.js"></script> <script type="text/javascript" src="/javascripts/test.js">
</script>
5 回复

楼主代码运行不通啊

路由是exports.upload 但是提交的是 ‘uploader’ : '/fileupload’,啊? 这怎么解释的通呢

这是3的代码。。。。。

奥。我的app.js里面配置的上传路径,是fileupload

回到顶部