Join the Stack Overflow Community
Stack Overflow is a community of 6.6 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I have a file being cropped and loaded on the angular side. Thanks to https://github.com/danialfarid/ng-file-upload

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

Angularjs side.

$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);
  });
}

I can see the file in the developer window. My issue seems to be on the Nodejs side.

 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 side..

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);

Any help would be great..

Thanks Phil

share|improve this question
up vote 1 down vote accepted

Ok,

I found an answer.

$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>

Node side working

POST /signup/user/uploads 
facebookTrip2.JPG
image/png
/tmp/G57AspvNo8eSxZs7YR9s8qjT.JPG
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.