Search code examples
node.jsfile-uploadbase64cloudinary

cloudinary -base 64 image upload giving invalid JSON response


I am trying to upload the image in base64 format on CLOUDINARY

cloudinary.config({
  cloud_name: CLOUDINARY_NAME,
  api_key: CLOUDINARY_API_KEY,
  api_secret: CLOUDINARY_API_SECRET,
});

Two approaches I have tried

1.  Let newPhoto='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=='//hardcoded value
try {
const myCloud = await cloudinary.v2.uploader.upload(newPhoto, {

folder: "UserPhoto",
width: 150,
crop: "scale",
});

}catch (error) {

return next(new ErrorHandler(error.message, 500));   }

2.  cloudinary.v2.uploader.upload("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==",
function(error, result) {console.log(result, error); });

I am receiving the below response

undefined {
  message: 'Server return invalid JSON response. Status Code 404. SyntaxError: Unexpected token < in JSON at position 0',
  name: 'Error',
  http_code: 404
}

Error: Server return invalid JSON response. Status Code 404. SyntaxError: Unexpected token < in JSON at position 0

I have used the same base64 image string which they have provided on their official document

This is the link -https://cloudinary.com/documentation/upload_images#file_source_options
section-Upload via a base64 data URI

How can I upload the base64 image in cloudinary


Solution

  • You could use the Node.js v2 (https://cloudinary.com/documentation/node_integration) for the backend server implementation as shown below:

    var cloudinary = require('cloudinary').v2; 
    
    cloudinary.config({ 
       cloud_name: '<YOUR_CLOUD_NAME>', 
       api_key: '<YOUR_API_KEY>', 
       api_secret: '<YOUR_API_SECRET>',
       secure: true
    });
    
    var newPhoto = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
    
    cloudinary.uploader.upload(newPhoto, 
    { 
        folder: "UserPhoto",
        width: 150,
        crop: "scale",
    },
    function(error, result) {console.log(result, error); });