Convert Image dataURI to multipart/form-data to send on a Web API

help
1

Hello,

I’m new to Meteor, and I struggle with the following issue.

Using the mdg:camera package, I’m able to take a picture and store it in a Session variable.
The image data is in dataURI format “data:image/jpeg;base64,/9j/4AAQS …”.

Now, I’d like to send a post request to another server, with this image embedded in a multipart/form-data request.

Does anybody know if there is an available package to convert this dataURI to a multipart/form-data request?

I try to do it myself, but I can’t get a valid format.

function multipartFormData (imageURI) {
  var boundary = '----'+(new Date()).getTime();
  var bodyString = [];
  bodyString.push(
    '--' + boundary,
    'Content-Disposition: form-data; name="' + "file" + '";' + 'filename="' + "my_file.jpg" + '"',
    'Content-type: ' + "image/jpeg",
    'Content-Transfer-Encoding: base64',
    imageURI.substring(23) //remove the beginning of the string data:image/jpeg;base64,
  );  
  bodyString.push('--' + boundary + '--','');

  var content = bodyString.join('\r\n');
  return {
    content: content,
    headers: {
      'Content-Type': 'multipart/form-data; boundary='+boundary,
      'Content-Length': content.length
    }
  }
}

Thank you!

EDIT:
Finally, the function below works for me, to create a multipart/form-data from a data URI image/jpeg, base64.
I’m still interested in knowing how to do this in a cleaner way…

function multipartFormData (image) {
  var boundary = '----'+(new Date()).getTime();
  var bodyString = [];
  bodyString.push(
    '--' + boundary,
    'Content-Disposition: form-data; name="' + "file" + '";' + 'filename="' + "my_file.jpg" + '"',
	'Content-Type: ' + "image/jpeg",
	'Content-Transfer-Encoding: base64','', //need /r/n twice here
	 image.substring(23) //remove the data:image/jpeg;base64,
  );  
  
  bodyString.push('--' + boundary + '--','');

  var content = bodyString.join('\r\n');
  return {
    content: content,
    headers: {
      'Content-Type': 'multipart/form-data; boundary='+boundary,
		'Content-Length': content.length
    }
  }
}
2

Created an account just to say thank you. I used your code to simulate an input type file element submit. Cheers!

3

I tried this and passed in a base64 for my image. I got a PayloadTooLargeError: request entity too large exception. Am I not supposed to be passing in the base64?