2016-09-27 19 views
1

FormData xhr要求から受信ファイルを保存しようとしていますが、着信要求を解析できません。これは私がファイルを送信しようとしている方法です:Express 4とMulterを使用してファイルを保存する方法は?

... 
    let xhr = new XMLHttpRequest(), 
    formData = new FormData(); 

    for(let i = 0; i < this.files.length; i++) { 
     formData.append(this.files[i], this.files[i].name); 
    } 
    xhr.open('POST', URL, true); 
    xhr.send(formData); 
... 

そして、これは私がそれをキャッチしようとしている方法です:

var express = require('express'); 
var router = express.Router(); 
var multer = require('multer'); 
var uploads = multer({dest: './uploads/'}); 

router.post('/upload', uploads.any(), function (req, res) { 
    console.log(req.files); // [] 
    console.log(req.file); // undefined 
    console.log(req.body); //{ '[object File]': '20160715_104330.jpg' } 
}); 

画像がサーバー上に来るが、ディレクトリへの書き込みをされていませんアップロード。

ディレクトリアップロードで画像を保存するにはどうすればよいですか?

答えて

1

エラーが見つかりました。以下は訂正されたコード行です:

​​

私はちょうど最初のパラメータを置く必要があったフィールド名を表す文字列です。

は、バックエンドでの結果を参照してください:

以下
var express = require('express'); 
var router = express.Router(); 
var multer = require('multer'); 
var uploads = multer({dest: './uploads/'}); 

router.post('/upload', uploads.any(), function (req, res) { 
    console.log(req.files); 
    /* [ { fieldname: 'Choose your Fieldname', 
      originalname: '20160715_104330.jpg', 
      encoding: '7bit', 
      mimetype: 'image/jpeg', 
      destination: './uploads/', 
      filename: '72b7a52101537ab1006f4feb0fa752be', 
      path: 'uploads\\72b7a52101537ab1006f4feb0fa752be', 
      size: 233509 } ] 
    */ 
    console.log(req.file); // undefined 
    console.log(req.body); //{} 
}); 

は、フロントエンドでの小さなコードです:

... 
    upload(){ 
     let xhr = new XMLHttpRequest(), 
     formData = new FormData(); 
     formData.append('Choose your Fieldname', this.files[0], this.files[0].name); 
     xhr.open('POST', URL, true); 
     xhr.send(formData); 
    } 
... 
関連する問題