Question

所以我尝试使用Multer上传图片，但我想使用Angular的$ http.post上传文件。没有提交按钮触发表单方法和操作。问题是，如果我不使用encrypt，method或post属性，则req.file最终未定义，并且图像不会显示在uploads文件夹中。

所以我的问题是，有没有什么方法可以使用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对象。

最后我的Angular代码：

$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（）回调，如果我深入研究它，那是因为我的节点app.js中的req.file未定义< / p>

Answer 1

您使用headers: {'Content-Type': undefined}的原因您应该发送图像的内容类型而不是未定义或者删除该标题并尝试。同样通过使用console.log（req.body），您可以查看提交的正文

使用Multer上传文件而不使用操作，方法，加密=＆＃34; multipart / form-data＆＃34;表单标签上的属性

1 个答案: