上傳文件與Multer沒有使用動作，方法，加密=「multipart/form-data」屬性在窗體標籤

所以我想上傳一個圖像與Multer，但我想用Angular的$ http.post上傳文件。沒有提交按鈕觸發表單方法和操作。問題是，如果我不使用加密，方法或發佈屬性，則req.file最終未定義，並且圖像未顯示在上傳文件夾中。上傳文件與Multer沒有使用動作，方法，加密=「multipart/form-data」屬性在窗體標籤

所以我的問題是，有沒有什麼辦法可以使用Multer文件上傳，而不是通過常規的形式方法與行動，但角的$ http.post（）。當我這樣做時，req.file總是未定義的。

這裏是我的參考代碼

app.js（節點）

var express = require('express'); 
var http = require('http'); 
var path = require('path'); 
var fs  = require('fs'); 
var crypto = require('crypto'); 
var multer = require('multer'); 
var bodyParser = require('body-parser'); 
var app = express(); 
var port = process.env.port || 8080; 

app.set('view engine', 'ejs'); 
app.use('/assets', express.static(__dirname + '/public')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: false })); 

var path = require('path'); 
var multer = require('multer'); 

var storage = multer.diskStorage({ 
    destination: './public/uploads/', 
    filename: function (req, file, cb) { 
    crypto.pseudoRandomBytes(16, function (err, raw) { 
     if (err) { return cb(err); } 
      cb(null, raw.toString('hex') + path.extname(file.originalname)); 
    }); 
    } 
}); 

var upload = multer({ storage: storage }); 

app.get('/', function (req, res) { 
    'use strict'; 
    res.render('index', {filename: filename }); 
}); 

app.post('/', function (req, res) { 
    'use strict'; 
}); 

app.post('/upload', upload.single('image'), function (req, res) { 
    filename = req.files; 
    console.log(req.files); 
}); 

app.listen(port);

HTML表單：

<form action="/upload" method="post" encrypt="multipart/form-data"> 
<div class="form-group"> 
<label for="image">Choose Image</label> 
<input id="inputImage" name="image" type="file"> 
<button class="form-control" ng-click="uploadFile()">Add</button> 
</form>

所以我基本上要刪除此默認行爲，並仍然得到REQ .file對象。

最後我的角度代碼：

$scope.uploadFile = function(){ 
     var file = $scope.myFile; 
     var uploadUrl = "/upload"; 
     var fd = new FormData(); 
     fd.append('file', file); 

     $http.post(uploadUrl,fd, { 
       transformRequest: angular.identity, 
       headers: {'Content-Type': undefined} 
     }) 
     .success(function(){ 
      console.log("success!!"); 
     }) 
     .error(function(){ 
      console.log("error!!"); 
     }); 
    };

請幫我在這...現在我得到了$ http.post（）.error（）回調，如果我深入挖掘它，它是因爲req.file在我的節點中未定義app.js

來源

2017-02-28 siddube

爲什麼你使用標題：{'Content-Type'：undefined}？ – AJS

我不應該用這個嗎？我很抱歉，但我從另一個答案中找到了這個片段...所以我用它 – siddube

你應該發送內容類型的圖像，而不是未定義的。否則刪除該標題，並嘗試 – AJS

爲什麼您使用的是headers: {'Content-Type': undefined} 您應該發送圖像的內容類型而不是未定義的或者刪除該標題並嘗試。也通過使用console.log（req.body）你可以檢查你提交什麼主體

來源

2017-02-28 14:01:17 AJS

上傳文件與Multer沒有使用動作，方法，加密=「multipart/form-data」屬性在窗體標籤

回答

相關問題