6

Situation

I'm using MEAN.JS framework (MongoDB, ExpressJS, AngularJS and NodeJS).

Using AngularJS in frontEnd; I have a JSON with a base64 encoded image in a field.

What I want?

  • I want to send this JSON to the server (NodeJS).

I'm using RESTful:

controller:

var article = new Articles ($scope.article);


article.$save(function(response) {
    //If all is OK
}, function(errorResponse) {
    //Error 
 });

$scope.article have a field named "image" ($scope.article.image) with the base64 string of the image.

service:

(function() {
'use strict';

angular
    .module('articles')
    .factory('articles', ['$resource',

    function($resource) {
        return $resource('articles/:articleId', { articleId: '@_id'
        }, {
            update: {
                method: 'PUT'
            }
        });
    }
]);})();

Problems

If the JSON don't have any Base64 Image in a field works fine...

But...

If we add the Base64 String of the Image in a field the server response with this error:

    Error: request entity too large at makeError (/Users/aralroca/Documents/Aral/Projecte/node_modules/body-parser/node_modules/raw-body/index.js:184:15)
at module.exports (/Users/aralroca/Documents/Aral/Projecte/node_modules/body-parser/node_modules/raw-body/index.js:40:15)
at read (/Users/aralroca/Documents/Aral/Projecte/node_modules/body-parser/lib/read.js:62:3)
at jsonParser (/Users/aralroca/Documents/Aral/Projecte/node_modules/body-parser/lib/types/json.js:96:5)
at Layer.handle [as handle_request] (/Users/aralroca/Documents/Aral/Projecte/node_modules/express/lib/router/layer.js:82:5)
at trim_prefix (/Users/aralroca/Documents/Aral/Projecte/node_modules/express/lib/router/index.js:269:13)
at /Users/aralroca/Documents/Aral/Projecte/node_modules/express/lib/router/index.js:236:9
at Function.proto.process_params (/Users/aralroca/Documents/Aral/Projecte/node_modules/express/lib/router/index.js:311:12)
at /Users/aralroca/Documents/Aral/Projecte/node_modules/express/lib/router/index.js:227:12
at Function.match_layer (/Users/aralroca/Documents/Aral/Projecte/node_modules/express/lib/router/index.js:294:3)

Say that the request entity is too large... The image size is 84Kb!!!!!

(I tried with $http resource and occurs the same...)

  • How can I solve this server error?
  • What is the best way to send from Angular to Node a Base64 encoded image?
  • Any suggestions?

Relationed answers:

I tried to do this but don't work and don't understand:

 app.use(bodyParser.urlencoded({limit: '50mb'}));
 app.use(bodyParser.json({limit: '50mb'}));

bodyParser is deprecated and the size of the Base64 Image is 84kb!!!!!

Thank you!!

Community
  • 1
  • 1
Aral Roca
  • 4,205
  • 4
  • 41
  • 67
  • Is the app behind a proxy? In that case check the proxy config too. – jmingov Jun 30 '15 at 13:23
  • Try using this [private npm module](https://www.npmjs.com/package/base64-image). – sam100rav Jun 30 '15 at 14:01
  • Im also sending a base64 image via post request and also had some trouble with the size. I have in my express config: `app.use(bodyParser.urlencoded({limit: '50mb', extended: true}));` and `app.use(bodyParser.json({limit: '50mb'}));` and it's working fine. – pgrodrigues Jun 30 '15 at 16:08
  • mmm don't work now this solution because bodyParser is now deprecated... Another way, I don't understand why happen this... For default the limit is in 1MB but the size of the base64 image is 84kb only... Maybe there are a code similiar to bodyParser.urlencoded and bodyParser.json not deprecated? Thank you! – Aral Roca Jun 30 '15 at 23:35
  • @sam100rav I tried with base64-image npm module and occurs the same problem!! Error: request entity too large ... – Aral Roca Jul 01 '15 at 10:31
  • @jmingov is in localhost using grunt, there aren't any proxy. – Aral Roca Jul 01 '15 at 10:58
  • localhost using grunt > Looks like grunt development server is not getting the app use config. – jmingov Jul 01 '15 at 11:27

1 Answers1

0

Try using :

var express = require('express');
var app = express();
var busboy = require('connect-busboy');

app.post("/url_path",
busboy({
    limits: {
        fileSize: 10 * 1024 * 1024
    }
}),
function(req, res, next) {
    // check that the request's body was as expected
    if (!req.busboy) return next('route'); // or next(new Error('...'));

    // ...
});

// ...

For more info checkout this private npm.

sam100rav
  • 3,516
  • 4
  • 23
  • 42
  • I tried now this solution but doesn't work and the problem already exists... Error: request entity too large... – Aral Roca Jul 02 '15 at 11:01