0

I am trying to force a download of an image and I always get failed - network error on that

here is my code

function download(filename: string, text: any) {
    var element = document.createElement('a');
    if (filename.includes('.csv')) {
        element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
    } else {
        element.setAttribute('href', 'data:image/png;base64,' + encodeURIComponent(text));
    }
    element.setAttribute('download', filename);
  
    element.style.display = 'none';
    document.body.appendChild(element);
  
    element.click();
  
    document.body.removeChild(element);
}
  
export const downloadApi = {
    getFile(payloadUrl: string = "",
            payload: string = "",
            fileName: string = "",
            fileExt: string = "",
            headers?: any) {
        return instance.get(`${payloadUrl}?${payload}`, {
            headers: {
                "Content-Type": "application/json",
                "Accept": "application/json, text/plain, */*"
            }
        }).then((response) => {
            if (!response.data) {
                return response.status;
            }
            download(fileName, response.data)
        })
    }

and this is how the response looks like

enter image description here

and the result

enter image description here

user2004
  • 1,783
  • 4
  • 15
  • 42
  • 1
    it's not `encoded` - that's a JPEG – Bravo Feb 24 '22 at 08:17
  • I'm not sure if it has anything to do with your errors, but you should use `URL.createObjectURL()` and `URL.revokeObjectURL()` to construct the `href` of the downloader element. – FZs Feb 24 '22 at 08:28
  • @Bravo I see what you mean, but surely JPEG is a kind of encoding... – FZs Feb 24 '22 at 08:37
  • JPEG is a binary format. How it was encoded for transport is independant of that. In this case it seems it is just the binary, so I believe you put a blob URL in the `src`. – Peter Krebs Feb 24 '22 at 08:49
  • Does this answer your question? [Convert blob to base64](https://stackoverflow.com/questions/18650168/convert-blob-to-base64) – Peter Krebs Feb 24 '22 at 08:49

0 Answers0