

However, if the download fails due to file-related, network-related, user-related, or other error, that error is reported.Ī string representing the post body of the request.

AWS limits the size of request bodies to ~6MB. If you're using a serverless solution, be mindful of their Request Payload size limits.

This simply takes the data in the result body and feeds it into the body of the response to the client. image/png for the content-type header and file extension to be accurate. Note here too you might want to have some sort of library or checker to determine the image MIME type e.g. Setting the appropriate headers for the response:Ĭontent-dispostion with a value of attachment will tell the browser to save the file instead of the alternative inline which will try to render the response in the browser.Instead of making a fetch directly to the image, you will make it to your Node.js API endpoint, which could be set up as follows: The following example only requires one simple change to the download logic on the client - the URL. a Node.js server - CORS can be safely bypassed. Luckily, for requests not coming from a browser e.g. Making image download robust with Node.js CORS or Cross-Origin Resource Sharing may many times cause the download to fail from the browser if the resource is not on the same origin, or doesn't have the appropriate headers set. This experience may be more user-friendly, but don't be surprised if you run into the notorious CORS wall. Because the anchor tag has an object URL, the browser will initiate the download to the user's Download Folder. The client-side code above listens to a click on the HTML button, fetches the image as a blob, creates an objectURL, adds it to a newly created (hidden) anchor tag and clicks it to initiate a download. Enter fullscreen mode Exit fullscreen mode
