2014-05-17 20 views
0

我現在使用angular-file-upload軟件包來上傳文件。在按下item.upload()之後,它宣稱成功上傳了該文件,但是我看到req.body是空的。請幫忙!無法將文件從AngularJS上傳到ExpressJs

這裏是角代碼來處理:

var uploader = $scope.uploader = $fileUploader.create({ 
     scope: $scope,       // to automatically update the html. Default: $rootScope 
    url: '/api/teams/upload', 
    formData: [ 
     { key: 'value' } 
    ], 
    filters: [ 
     function (item) {     // first user filter 
      $scope.previewImage(item); 
      return true; 
     } 
    ] 
}); 

這裏是觸發上傳方式:

uploader.bind('afteraddingfile', function (event, item) { 
    // console.info(item.file); 
    console.info('After adding a file', item); 

    // console.log('item.upload();'); 
    item.upload(); 
}); 

最後這裏是明確的js代碼:

exports.upload = function(req, res) { 
// console.log('req.headers'); 
// console.log(req.headers); 

console.log('req.body'); 
console.log(req.body); 

它有什麼問題?

回答

0

首先確保你的文章被編碼爲enctype="multipart/form-data" ....

在快遞4您需要設置服務器的body parser

var bodyParser  = require('dy-parser'); 
//... 

var app   = express(); 
//... 
app.use(bodyParser()); // pull information from html in POST 

var busboy = require('connect-busboy');  
app.use(busboy()); 

在早期版本的快車,你只需要添加從框架本身的身體分析器和文件將被存儲在配置的位置:

 app.use(express.bodyParser({limit: '10mb', uploadDir: __dirname + '/public/uploads' }));    // pull information from html in POST 

由於版本4刪除支持連接現在,你需要添加多/表單數據的自定義支持,解析器多/部分崗位,所以你將不得不做這樣的事情:

var fs = require('fs'); 
var busboy = require('connect-busboy'); 

//... 
app.use(busboy()); 
//... 
app.post('/api/teams/upload', function(req, res) { 
    var fstream; 
    req.pipe(req.busboy); 
    req.busboy.on('file', function (fieldname, file, filename) { 
     console.log("Uploading: " + filename); 
     fstream = fs.createWriteStream(__dirname + '/files/' + filename); 
     file.pipe(fstream); 
     fstream.on('close', function() { 
      res.redirect('back'); 
     }); 
    }); 
}); 

在您需要調用$upload.upload要啓動客戶端上傳