0

i am trying to increase the file size limit in nodejs server. after searching and making changes also iam still getting same error. Tried everything mentioned on stackoverflow and also other sites but couldn't solve the issue. i have been wasting more time on this. please some one help me with this

app.js :

var express = require("express");

var Middlewares = require("./config/middlewares/middleware");


var bodyParser = require('body-parser');  

var app = express();

var port = parseInt(process.env.PORT, 10) || 5000;

app.set("port", port);

app.use(Middlewares.configuration);

app.listen(port, function () {
    console.log("Node app is running at localhost:" + port);
});

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

package.json :

{
  "name": "dinely.api",
  "version": "2.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "dinely",
  "license": "ISC",
  "dependencies": {
    "express": "*",
    "body-parser": "*",
    "file-system": "^2.2.2",
    "jsonwebtoken": "^7.4.1",
    "jwt-simple": "^0.5.1",
    "method-override": "*",
    "mongoose": "*",
    "passport": "^0.3.2",
    "passport-jwt": "^2.2.1"
  }
}

front-end

html :

<div class="column">
                            <p class="label">Logo<span class="required">*</span></p>
                            <div >
                                <input type="file" name="logo" required (change)="fileChange(input)" #input style="text-indent: 0px;"/>
                                <img [attr.src]='file_srcs' alt="" style="width:15%;margin-top:10px;"/>
                                <div *ngIf="logoValid" class="help-block" style="color:red">Select Image</div>
                            </div>
                        </div>

component.ts :

  fileChange(input) {  
      debugger;
        this.readFiles(input.files);  

  }  

  readFiles(files) {  

      let reader = new FileReader();

      this.readFile(files[0], reader, (result) => {  

              var img = document.createElement("img");  
              img.src = result;  

              this.fileExtension = files[0].type.replace("image/","");

              this.resize(img, 250, 250, (resized_jpeg, before, after) => {  

                  this.debug_size_before.push(before);  
                  this.debug_size_after.push(after);  
                  console.log("before : " + this.debug_size_before + " after : " + this.debug_size_after)
                  this.file_srcs = resized_jpeg; 

                  var formdata =  new FormData();
                  formdata.append("formImg",resized_jpeg);

                  console.log(formdata);

              });  
          });  
  }

  // for image compression
  resize(img, MAX_WIDTH: number, MAX_HEIGHT: number, callback) {  

    return img.onload = () => {  

        var width = img.width;  
        var height = img.height;  

        if (width > height) {  
            if (width > MAX_WIDTH) {  
                height *= MAX_WIDTH / width;  
                width = MAX_WIDTH;  
            }  
        } else {  
            if (height > MAX_HEIGHT) {  
                width *= MAX_HEIGHT / height;  
                height = MAX_HEIGHT;  
            }  
        }  

        var canvas = document.createElement("canvas");  

        canvas.width = width;  
        canvas.height = height;  
        var ctx = canvas.getContext("2d");  
        ctx.drawImage(img, 0, 0, width, height);  

        var dataUrl = canvas.toDataURL('image/' + this.fileExtension);  

        callback(dataUrl, img.src.length, dataUrl.length);  
    };  
  }

  readFile(file, reader, callback) {  

      reader.onload = () => {  
          callback(reader.result);  
          this.imageURL = reader.result;  
          this.uploadImgToServer(reader.result);
      }  

      reader.readAsDataURL(file);
  }

  // upload image to server api call
  uploadImgToServer(url){

    return this._dataService.uploadImage({

              "imgUrl" : url,
              "path" : "/images/RestaurantLogos",
              "name" : this.generateRandomImgName(),
              "extension" : this.fileExtension 

            }).then(
              data => {           
                console.log("iamge uploaded");
              },
              error => {
              });
  } 

  // generates random string for image name
  generateRandomImgName(){

    var dt = new Date(); 
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";  

    for (var i = 0; i < 5; i++){

      text += possible.charAt(Math.floor(Math.random() * possible.length)); 
    }  

    this.imagepath = text;

    return text;
  }
san2706
  • 5
  • 4

1 Answers1

1

Check in this link

https://expressjs.com/en/resources/middleware/body-parser.html https://www.npmjs.com/package/bytes

limit

Controls the maximum request body size. If this is a number, then the value specifies the number of bytes; if it is a string, the value is passed to the bytes library for parsing. Defaults to '100kb'.

They mentioned limit values is in bytes

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

you have to set the limit in bytes.

Devaraj C
  • 167
  • 2
  • 11
  • the problem i was thinking would be that, from front-end i am sending the image by encrypting it to base64, but body parser will not work for file uploads. I don't know if i was correct or not. – san2706 Jul 27 '17 at 13:11
  • @san2706 perhaps you should add your frontend code to your question – robertklep Jul 27 '17 at 13:38
  • @robertklep i have added the front-end code as well, please take a look – san2706 Jul 28 '17 at 06:03