无法在节点 js 中使用 angularjs http 上传文件答案

【问题标题】：Not able to upload file using angularjs http in node js无法在节点 js 中使用 angularjs http 上传文件
【发布时间】：2016-03-24 23:03:53
【问题描述】：

我无法在 angularjs 中使用 http 上传文件/图像。

这是我的控制器：

$scope.uploadFile = function(file, shipment_id, type, e) {
        if (file == null) {
            alert("Please enter image");
            return false;
        }

        var fileReader = new FileReader();
        fileReader.readAsDataURL(file);
        fileReader.onload = function(e) {

           // var base64encodedfile = e.target.result.match(/,(.*)$/)[1];
            var base64encodedfile = e.target.result;
            var data = {
                "file": {
                    "file":base64encodedfile,
                    "filename": file.name,
                     //"contentType": 'multipart/form-data',
                    //"filepath": "public://" + file.name,
                    "filemime": file.type
                }
            };
           console.log(e.target, 'dddd');
            var image_data = {
                'image': e.target.result,
                'shipment_id': shipment_id,
                'image_type': type,
               // "contentType": 'multipart/form-data',
            };
            console.log(image_data);

            //     var imageDATA = Base64.encode(image_data);
            $http({
                    method: 'POST',
                    url: store_config.BASE_URL + 'uploadImage/',

                    headers: {
                       // 'Content-Type': 'multipart/form-data',
                        'x-access-token': localStorage['token'],
                        'user_token': localStorage['user_token']
                    },
                    data: image_data
                })
                .success(function(data, status) {
                    console.log(data);
                })
                .error(function(d) {

                    console.log("not calling nope");
                });    
        }
    };

这是我将文件上传到 nodejs 服务器的 app.js 代码：

apiRoutes.post('/uploadImage', function (req, res) {

console.log(req.body);
console.log("HHHHHHH");
request({
    url: api_url+'rms/seller_payment/unsettled/', //URL to hit
     headers: { //We can define headers too
        'Content-Type': 'multipart/form-data    ',
        'Access-Token': req.headers.user_token,
        'X-API-Version': '1.6'
    },
    method: 'POST', //Specify the method
    form: req.body
}, function(error, response, body){
    if(error) {
    console.log("error");
        console.log(error);
    } else {
    console.log("body");
     res.send(body);
       }
    });

});

当我使用邮递员尝试这个时，它工作正常。

请帮帮我。

console.log(req.body)

{ image: 'data:image/png;base64,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',
  shipment_id: '56237961_1',
  image_type: 'pod' }

【问题讨论】：

究竟是什么不工作？你得到什么错误？
文件未上传到服务器。我没有收到任何错误
console.log(req.body) 被调用了吗？你到达你的路线了吗？
好的，图像被上传到服务器，因为你可以console.log它。你得到{ image: 'data:image/png;base64...
是的，但是图片没有上传到服务器。你能告诉什么问题吗？

标签： javascript angularjs node.js

【解决方案1】：

我的问题已经解决了：

在 HTML 中

<div ng-class="item.invoice" ng-if="item.image_invoice_thumb == ''" ngf-select="uploadFile($file,item.shipment_id,'pod',rowIndex,columnIndex)" ng-model="file">Upload</div>

在控制器中：

$scope.uploadFile = function(file,shipment_id,type,rowIndex,columnIndex) {
        if (file == null) {
            alert("Please enter image");
            return false;
          }

            $upload.upload({
                url: store_config.BASE_URL + 'uploadImage/',
                 method: 'POST',
                headers: {
                  'Content-Type': 'application/json',
                  'x-access-token': localStorage['token'],
                  'user_token': localStorage['user_token'],
                  'shipment_id': shipment_id,
                  'image_type': type
                },
                file: file,
              }).progress(function(evt) {
                console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
              }).success(function(data, status, headers, config) {
                $rootScope.orders[rowIndex].items[columnIndex].deliver = "ofd";
              });
   };

在 app.js 中

您必须安装模块：multer 和 fs。

var multer  = require('multer');
var upload = multer({ dest: 'uploads/' });
var fs = require('fs');

apiRoutes.post('/uploadImage', upload.single('file'), function(req, res, body){

var fdd = { image: 
              { value: fs.createReadStream(req.file.path),
                options: { filename: req.file.originalname, contentType: null } },
             shipment_id: req.headers.shipment_id,
             image_type: req.headers.image_type };

request.post({url:api_url+'rms/seller_payment/unsettled/',
    headers: {
        'Content-Type': 'application/json',
        'Access-Token': req.headers.user_token
    }, 
    formData: fdd
    },
     function optionalCallback(err, httpResponse, body) {
  if (err) {
    return console.error('upload failed:', err);
  }
  fs.unlink(req.file.path, function (err) {
      if (err) throw err;
    });
  res.send(httpResponse);
});


});

【讨论】：