Angular / nodejs ng-file-upload - 文件加载角度但在nodejs端丢失

时间:2016-02-26 23:37:34

标签: javascript angularjs node.js express

我有一个文件被裁剪并加载在角边。谢谢 https://github.com/danialfarid/ng-file-upload

        SignUp2ControllerTest -- $scope.upload -->
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAgAElEQVR4Xmy9CbAk61Ue+GVmZWZl7XX32337db9Veov0tCEhJIyFsc2iwQOefWJmFI7AIIztYBxETNgOIiYM42

Angularjs方面。

$scope.upload = function (dataUrl) {

  console.log(' SignUp2ControllerTest -- $scope.upload --> ',  dataUrl);

  Upload.upload({
    url: 'http://test.dev:3000/register/user/uploads',
    data: {
      file: Upload.dataUrltoBlob(dataUrl)
    },
  }).then(function (response) {
    $timeout(function () {
      $scope.result = response.data;
    });
  }, function (response) {
    if (response.status > 0) $scope.errorMsg = response.status
      + ': ' + response.data;
  }, function (evt) {
    $scope.progress = parseInt(100.0 * evt.loaded / evt.total);
  });
}

我可以在开发者窗口中看到该文件。我的问题似乎是在Nodejs方面。

 route: 
   { path: '/user/uploads',
     stack: [ [Object], [Object] ],
     methods: { post: true } },
  files: 
   { file: 
      { fieldName: 'file',
        originalFilename: 'undefined',
        path: '/tmp/noKbOGnCb-H_RVUMuF_QSqQs',
        headers: [Object],
        size: 70599,
        name: 'undefined',
        type: 'image/png' } },
  _body: true,
  read: [Function] }
UserController.prototype. req.files { file: 
   { fieldName: 'file',
     originalFilename: 'undefined',
     path: '/tmp/noKbOGnCb-H_RVUMuF_QSqQs',
     headers: 
      { 'content-disposition': 'form-data; name="file"; filename="undefined"',
        'content-type': 'image/png' },
     size: 70599,
     name: 'undefined',
     type: 'image/png' } }
UserController.prototype. undefined
=========================>>  undefined
=====+++++++++++++++====>>  image/png

Nodejs方..

UserController.js

UserController = function(){};

UserController.prototype.uploadFile = function(req, res) {
    // We are able to access req.files.file thanks to
    // the multiparty middleware
    var file = req.files.file;
    console.log('UserController.prototype. req' ,req);
    console.log('UserController.prototype. req.files' ,req.files);
    console.log('UserController.prototype.' ,file.name);
    console.log('=========================>> ' ,file.name);
    console.log('=====+++++++++++++++====>> ' ,file.type);
}

module.exports = new UserController();

Nodejs

var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();


// Requires controller
var UserController = require('../controllers/UserController');

// Example endpoint
router.post('/user/uploads', multipartMiddleware, UserController.uploadFile);

任何帮助都会很棒......

由于 菲尔

1 个答案:

答案 0 :(得分:1)

确定,

我找到了答案。

$scope.upload = function (dataUrl, picFile) {

  Upload.upload({
    url: 'http://test.dev:3000/register/user/uploads',
    data: {
      file: Upload.dataUrltoBlob(dataUrl, picFile.name)
    },

Angular side。

  <button class="row-left btn btn-primary" ng-click="upload(croppedDataUrl, picFile)">Submit</button>

节点侧工作

POST /signup/user/uploads 
facebookTrip2.JPG
image/png
/tmp/G57AspvNo8eSxZs7YR9s8qjT.JPG