在Node.js中使用FineUploader上传文件挂起了服务器

Question

我一直在解决这个错误超过两个星期了，并且找不到出错的地方。我已经使用FineUploader来上传多个文件。我有一个项目的集合，每个需要得到它自己的图像。所以我将一个参数放在请求中，以确定图像对应的项目。我也有图片库和徽标的上传者。

我手动触发上传并在服务器上获取请求，然后设置req.on（data，function（）{...}）来上传文件。这永远不会被触发。

这是我的代码：

$(document).ready(function() { 
    window.onSubmit = function (uploaderName) { 
     return function (id, fileName) { 
      console.log("Setting parameters...") 
      window[uploaderName].setParams({ 
       farm: $('input[name=farm-name]').val() 
      }); 
     } 
    }; 

    window.logoUploader = new qq.FineUploader({ 
     element: $('#logo')[0], 
     request: { 
      endpoint: '/upload/farm/logo' 
     }, 
     autoUpload: false, 
     debug: true, 
     validation: { 
      allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'], 
      sizeLimit: 1024000 // 50 kB = 50 * 1024 bytes 
     }, 
     text: { 
      uploadButton: '<i class="icon-plus icon-white"></i> Select Logo' 
     }, 
     callbacks: { 
      onSubmit: onSubmit("logoUploader") 
     } 
    }); 

    window.shareLogoUploader = []; 
    window.shareLogoUploader[0] = new qq.FineUploader({ 
    element: $('#share-logo-0')[0], 
    request: { 
     endpoint: '/upload/farm/share/gallery' 
    }, 
    autoUpload: false, 
    debug: true, 
    validation: { 
     allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'], 
     sizeLimit: 1024000 // 50 kB = 50 * 1024 bytes 
    }, 
    text: { 
     uploadButton: '<i class="icon-plus icon-white"></i> Select Logo' 
    } 
    }); 

    window.galleryUploader = new qq.FineUploader({ 
     element: $('#gallery')[0], 
     request: { 
      endpoint: '/upload/farm/gallery/photo' 
     }, 
     autoUpload: false, 
     debug: true, 
     validation: { 
      allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'], 
      sizeLimit: 2024000 // around 2mbs 
     }, 
     text: { 
      uploadButton: '<i class="icon-plus icon-white"></i> Pics' 
     }, 
     callbacks: { 
      onComplete: function (event, id, fileName, responseJSON) { 
       if (responseJSON.success) { 
        console.log(responseJSON, fileName); 
        $('#thumbnails').append('<img src="/uploads/' + fileName + '" width="256px"><input type="hidden" name="photos[]" value="' + fileName + '">'); 
       } 
      }, 
      onSubmit: onSubmit("galleryUploader") 
     } 
    }); 
}); 

// Shares 
var shares = []; 
var sharesGallery = []; 

$(function() { 
    $('section#shares button#add-share').click(function (e) { 
     e.preventDefault(); 

     var title = $('section#shares .control-group input[name=title]'); 
     var size = $('section#shares .control-group select[name=size]'); 
     var type = $('section#shares .control-group select[name=type]'); 
     var price = $('section#shares .control-group input[name=price]'); 
     var amount = $('section#shares .control-group input[name=amount]'); 
     var unit = $('section#shares .control-group select[name=unit]'); 
     var discount_3 = $('input[name=discount-3]').val(); 
     var discount_6 = $('input[name=discount-6]').val(); 
     var discount_12 = $('input[name=discount-12]').val(); 
     var errors = $('section#shares .control-group#errors'); 
     var delivery_period = $('section#shares .control-group input[name=delivery_period]'); 
     var delivery_period_es = $('section#shares .control-group input[name=delivery_period_es]'); 
     var billing_period = $('section#shares .control-group input[name=billing_period]'); 
     var billing_period_es = $('section#shares .control-group input[name=billing_period_es]'); 
     var logoUploader = window.shareLogoUploader[shares.length]; 
     var logoButtonId = "share-logo-" + shares.length; 

      shares.push({ 
       title: title.val(), 
       currency: $('select[name=currency]').children(':selected').val(), 
       size: size.children(':selected').val(), 
       type: type.children(':selected').val(), 
       price: price.val() * 100.0, 
       unit: unit.children(':selected').val(), 
       amount: amount.val(), 
       discounts: { 
        '3': [discount_3, price.val() * discount_3/100.0], 
        '6': [discount_6, price.val() * discount_6/100.0], 
        '12': [discount_12, price.val() * discount_12/100.0] 
       }, 
       delivery_period: delivery_period.val(), 
       delivery_period_es: delivery_period_es.val(), 
       billing_period: billing_period.val(), 
       billing_period_es: billing_period_es.val() 
      }); 

      var newLogoButtonId = "share-logo-" + shares.length; 

      sharesGallery.push({ 
       name: type.children(':selected').val() + "-" + size.children(':selected').val(), 
       logoUploader: logoUploader 
      }) 
     $("#" + logoButtonId).css('display', 'none'); 
     $("#" + logoButtonId).parent().append('<div id="' + newLogoButtonId + '"></div>'); 

     window.shareLogoUploader[shares.length] = new qq.FineUploader({ 
      element: $("#" + newLogoButtonId)[0], 
      request: { 
       endpoint: '/upload/farm/share/gallery' 
      }, 
      autoUpload: false, 
      debug: true, 
      validation: { 
       allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'], 
       sizeLimit: 1024000 // 50 kB = 50 * 1024 bytes 
      }, 
      text: { 
       uploadButton: '<i class="icon-plus icon-white"></i> Select Logo' 
      } 
     }); 

     console.log(shares); 

     return; 
    } 
}); 

这正确地触发上传，我得到的服务器上的请求，这样处理，那么服务器挂在等待一个永远不会到来，重新REQ数据。 on数据naver被触发。这是服务器端代码：

var fs = require('fs'), util = require('util'), uuid = require('node-uuid'); 

var uploadpath = __dirname + "/../public/uploads/"; 

var slugify = exports.slugify = function(value) { 
    return value.toLowerCase().replace(/-+/g, '').replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, ''); 
}; 
// Route that takes the post upload request and sends the server response 
exports.upload = function(req, res) { 
    winston.info("Upload parameters", [req.route.params[0], req.query.farm]); 
    uploadpath = __dirname + "/../public/uploads/"; 
    if(!fs.existsSync(uploadpath)) { 
     fs.mkdirSync(uploadpath); 
    } 
    switch(req.route.params[0]) { 
     case 'farm/logo': 
      uploadpath += "../farms/" + slugify(req.query.farm); 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      uploadpath += "/" + "logo." + req.header('x-file-name').split(".").pop(); 
      break; 

     case 'farm/gallery/photo': 
      uploadpath += "../farms/" + slugify(req.query.farm); 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      uploadpath += "/gallery"; 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      var fname = req.header('x-file-name'); 
      uploadpath += "/" + fname; 
      break; 

     case 'farm/share/gallery': 
      uploadpath += "../farms/" + slugify(req.query.farm); 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      uploadpath += "/shares"; 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      uploadpath += "/" + slugify(req.query.share); 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      uploadpath += "/gallery"; 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      var fname = req.header('x-file-name'); 
      uploadpath += "/" + fname; 
      break; 
     case 'courier/license': 
     case 'courier/registration': 
      uploadpath += "../couriers/" + slugify(req.query.courier); 
      if(!fs.existsSync(uploadpath)) { 
       fs.mkdirSync(uploadpath); 
      } 
      var fname = req.header('x-file-name'); 
      uploadpath += "/" + fname; 
      break; 

     default: 
      var fname = req.header('x-file-name'); 
      uploadpath += fname; 
      break; 
    } 

    winston.info("Uploading to ", uploadpath); 

    uploadFile(req, uploadpath, function(data) { 
     if(data.success) 
      res.send(JSON.stringify(data), { 
       'Content-Type' : 'text/plain' 
      }, 200); 
     else 
      res.send(JSON.stringify(data), { 
       'Content-Type' : 'text/plain' 
      }, 404); 
    }); 
} 
// Mainfunction to recieve and process the file upload data asynchronously 
var uploadFile = function(req, targetfile, callback) { 

    // Moves the uploaded file from temp directory to it's destination 
    // and calls the callback with the JSON-data that could be returned. 
    var moveToDestination = function(sourcefile, targetfile) { 
     moveFile(sourcefile, targetfile, function(err) { 
      if(!err) 
       callback({ 
        success : true 
       }); 
      else 
       callback({ 
        success : false, 
        error : err 
       }); 
     }); 
    }; 
    // Direct async xhr stream data upload, yeah baby. 
    if(req.xhr) { 

     // Be sure you can write to '/tmp/' 
     var tmpfile = '/tmp/' + uuid.v1(); 

     // Open a temporary writestream 
     var ws = fs.createWriteStream(tmpfile); 
     ws.on('error', function(err) { 
      console.log("uploadFile() - req.xhr - could not open writestream."); 
      callback({ 
       success : false, 
       error : "Sorry, could not open writestream." 
      }); 
     }); 
     ws.on('close', function(err) { 
      moveToDestination(tmpfile, targetfile); 
     }); 
     // Writing filedata into writestream 
     req.on('data', function(data) { 
      ws.write(data); 
     }); 
     req.on('end', function() { 
      ws.end(); 
     }); 
    } 

    // Old form-based upload 
    else { 
     moveToDestination(req.files.qqfile.path, targetfile); 
    } 
}; 
// Moves a file asynchronously over partition borders 
var moveFile = function(source, dest, callback) { 
    var is = fs.createReadStream(source) 

    is.on('error', function(err) { 
     console.log('moveFile() - Could not open readstream.', err); 
     callback('Sorry, could not open readstream.') 
    }); 
    is.on('end', function() { 
     fs.unlinkSync(source); 
     callback(); 
    }); 
    var os = fs.createWriteStream(dest); 
    os.on('error', function(err) { 
     console.log('moveFile() - Could not open writestream.', err); 
     callback('Sorry, could not open writestream.'); 
    }); 

    is.pipe(os); 
} 

有人点我在正确的方向来获得文件上传与文件中的每一束diferent参数？

预先感谢您。

Answer 1

看起来您正在使用Node示例，或者可能是Fine Uploader Github项目的服务器目录中Node节点示例的修改版本。该示例尚未更新为处理多部分编码的请求，Fine Uploader现在默认为所有浏览器发送该请求。

我对Node没有多少经验，但是如果您使用的是Express，您似乎可以/应该只使用req.files来获取与请求相关的文件。

我会在Widen/fine-uploader-server repo中打开一个案例来提醒我更新节点示例。

Answer 2

好吧，如果有人（像我）需要一个体面和简单的例子，用他们的node.js/express应用程序来实现Fine Uploader - 我终于能够得到它的工作。事实证明，我让自己变得比所需要的要困难得多，Fine Uploader服务器的例子并没有说明新版本的Express（这是express@3.1.1）现在有多容易。

app.use(express.bodyParser({uploadDir: __dirname + '/uploads'})); 

app.get('/upload', localQuery, function(request, response) { 
    //This serves up our 
    response.render('index'); 

}); 

app.post('/uploadhander', function (request, response, next) { 

    var fileName = request.files.qqfile.name 
    var savePath = __dirname + '/process/'; 

    //after upload, rename the file, then respond to fineuploader to tell it of success 
    fs.rename(request.files.qqfile.path, savePath + fileName, function(err) { 
    if (err != null) { 
     response.send(JSON.stringify({success: false, error: err}), {'Content-Type': 'text/plain'}, 404); 
    } else { 
     response.send(JSON.stringify({success: true}), {'Content-Type': 'text/plain'}, 200); 
    } 
    }); 

}); 

这里是玉模板/上传，处理精细上传选项的位（你的选择显然会有所不同）：

div.span12 
    h4 Upload a show file 
    #jquery-wrapped-fine-uploader 
     script(type='text/javascript') 
     jQuery(document).ready(function() { 
      jQuery('#jquery-wrapped-fine-uploader').fineUploader({ 
      debug: false, 
      request: { 
       endpoint: '/uploadhander', 
       params: { 
       hostname: "#{locals.query.hostname}", 
       hostport: "#{locals.query.hostport}", 
       bucket: "#{locals.query.bucket}", 
       nid: "#{locals.query.nid}", 
       title: "#{locals.query.title}", 
       }, 
       chunking: { 
       enabled: true, 
       }, 
       resume: { 
       enabled: true, 
       }, 
      } 
      }); 
     }); 

我应该指出的是，我还没有测试了恢复功能，但我可以验证多个上传正在处理，与已发布的示例显示的代码少得多。希望这可以帮助别人！

Answer 3

它更实用，使用简单multer与express.js 。我的服务器端代码看起来象

var multer = require('multer'); 

var upload = multer({ 
    dest : path.join(__dirname , '../public/uploads/') 
}); 

router.post('/upload', function (req, res) { 

    upload(req, res, function (err) { 

     if (err) 
      response.send(JSON.stringify({success: false, error: err}), {'Content-Type': 'text/plain'}, 404); 
     else 
      res.send(JSON.stringify({success: true}), {'Content-Type': 'text/plain'}, 200); 

    }); 


}); 

module.exports = router;