2015-11-07 68 views
0

我使用着名的angular-file-upload.js模塊上傳文件。「angular-file-upload.js」文件使用'node.js'上傳

在這個例子中:

'use strict'; 


angular 


.module('app', ['angularFileUpload']) 


.controller('AppController', ['$scope', 'FileUploader', function($scope, FileUploader) { 
    var uploader = $scope.uploader = new FileUploader({ 
     url: 'upload.php' 
    }); 

    // FILTERS 

    uploader.filters.push({ 
     name: 'imageFilter', 
     fn: function(item /*{File|FileLikeObject}*/, options) { 
      var type = '|' + item.type.slice(item.type.lastIndexOf('/') + 1) + '|'; 
      return '|jpg|png|jpeg|bmp|gif|'.indexOf(type) !== -1; 
     } 
    }); 

    // CALLBACKS 

    uploader.onWhenAddingFileFailed = function(item /*{File|FileLikeObject}*/, filter, options) { 
     console.info('onWhenAddingFileFailed', item, filter, options); 
    }; 
    uploader.onAfterAddingFile = function(fileItem) { 
     console.info('onAfterAddingFile', fileItem); 
    }; 
    uploader.onAfterAddingAll = function(addedFileItems) { 
     console.info('onAfterAddingAll', addedFileItems); 
    }; 
    uploader.onBeforeUploadItem = function(item) { 
     console.info('onBeforeUploadItem', item); 
    }; 
    uploader.onProgressItem = function(fileItem, progress) { 
     console.info('onProgressItem', fileItem, progress); 
    }; 
    uploader.onProgressAll = function(progress) { 
     console.info('onProgressAll', progress); 
    }; 
    uploader.onSuccessItem = function(fileItem, response, status, headers) { 
     console.info('onSuccessItem', fileItem, response, status, headers); 
    }; 
    uploader.onErrorItem = function(fileItem, response, status, headers) { 
     console.info('onErrorItem', fileItem, response, status, headers); 
    }; 
    uploader.onCancelItem = function(fileItem, response, status, headers) { 
     console.info('onCancelItem', fileItem, response, status, headers); 
    }; 
    uploader.onCompleteItem = function(fileItem, response, status, headers) { 
     console.info('onCompleteItem', fileItem, response, status, headers); 
    }; 
    uploader.onCompleteAll = function() { 
     console.info('onCompleteAll'); 
    }; 

    console.info('uploader', uploader); 
}]); 

這行代碼url: 'upload.php'將請求發送到一些php文件。

而不是php我使用node.js

要那麼努力,我創造了一些app.js文件有:

app.post('/loadFiles', function (request, response) { 
    response.send(200, { result: "ok" }); 
}); 

,改變控制器的代碼url: '/loadFiles'

我可以看到,這條路線被稱爲,但我不知道如何從request這裏得到圖像。

幾個谷歌搜索小時後,在我看來,我應該以某種方式對圖像進行編碼成itemuploader.onBeforeUploadItem事件控制器(然後以某種方式解碼服務器端的圖像),但我沒能找到一個完整的例子,決定要求你的幫助。

請問您可以指出服務器端(或者也可能是控制器端)的代碼以獲取從用戶瀏覽器傳遞到服務器的圖像嗎?

謝謝!

回答

0

好吧,這是我想通了:

有什麼可內uploader.onBeforeUploadItem完成。

我不得不這樣做才能進入服務器端文件是:

app.post('/loadFiles', multipartyMiddleware, function (req, res) { 
    var file = req.files.file; 
    console.log(file.name); 
    console.log(file.type); 
    console.log(file.path); 

    res.send(200, { result: "ok" }); 
}); 


var multiparty = require('connect-multiparty'), 
multipartyMiddleware = multiparty();