failed network error when downloading images in javascript

Question

When I try to download image on button click in javascript, am getting failed network error

function downloadImg(url, name){
    const link = document.createElement('a');
    link.href = `data:application/octet-stream;base64,${encodeURIComponent(url)}`;
    link.download = name;
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);

}

<button onclick=this.downloadImg("http://www.example.com/image.png", "img1.png");>Download</button>

Answer 1

You can try use this code

 const downloadImg = document.getElementById('downImg') downloadImg.onclick = function() { const url = downloadImg.getAttribute('imgurl') const name = downloadImg.getAttribute('name') const link = document.createElement('a'); link.href = `data:application/octet-stream;base64,${encodeURIComponent(url)}`; link.download = name; document.body.appendChild(link); link.click(); document.body.removeChild(link); }

 <button id="downImg" imgurl="https://thesafety.us/images/articles/javascript-logo.png" name="javascript-logo.png">Download</button>