How to process raw jpeg data into a file in javascript

Question

I'm trying to create a jpeg file from raw data in javascript

I've been using the google file picker api to allow users to select their images from drive and import into my application, but when I make the request to download the image google responds with raw data that looks like this:

Google's response

I have tried placing that data into a blob with:

var blob = new Blob([res.text], {type: 'image/jpeg'})

I have also tried placing the data into a file.

var file = new File([res.text], 'image.jpeg', {type:"image/jpeg"})

However the file only renders black pixels. How can I go about generating a jpeg file from that data so I can upload to my server?

Update(Solution): I switched my request api to fetch and used .blob() on the response

Answer 1

For superagent see http://visionmedia.github.io/superagent/#parsing-response-bodies -> Binary and http://visionmedia.github.io/superagent/#response-properties -> Response body.

You need to use .responseType('blob') and res.body.

https://stackblitz.com/edit/js-so-how-to-process-raw-jpeg-data-into-a-file-in-javascript