Search code examples
javascriptgreasemonkeymultipartform-datadata-uri

Javascript has an image as URI data, how do I upload this image via a multipart/form-data form?

My javascript script has an image as URI data, like this:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==

I have a multipart/form-data form that has an <input type="file" /> element. I want to use that <input type="file" /> element to send my image(the one I have as a Data URI) to the server.

I have no control over the server.

Is there a way to achieve this? Some way I can trick the browser to send my image to the server?

Solution

  • There is no way to set the <input type="file"> value programatically.

    However, you could replace the real form submission with an AJAX one. Using AJAX, you have more flexibility as to what is sent to the server.

    See this question: HTML5 File API readAsBinaryString reads files as much larger, different than files on disk.