How to download image from PWA in Safari iOS13+

Question

I am trying to implement downloading images from PWA. I am using

<a target="_blank"
   rel="noopener noreferrer"
   href="photo.url"
   download>Download image</a>

to achieve that. I am good on desktop Chrome and Safari and Chrome for Android. But when I am in a standalone mode (PWA) on Safari iOS 13 I can't close the opened window that was opened to save the file. On iOS 12 there was a button 'Done' and preview of the image.

I have tried solutions from here. But without success; Safari blocks the window.open().

can you try this answer [answer](https://stackoverflow.com/a/39165723/5740276) — Savaj Patel, Mar 05 '20 at 12:55
I'm currently struggling with this on iOS 14.5.1. The best "workaround" I've found so far is to change the `a` to a `button` which calls `window.open` on a Google Drive link (where I've uploaded a copy of the image) - this isn't ideal, as 1) if the user has Google Drive installed on their phone this method takes them out of the PWA and opens the Google Drive app, and 2) it relies on a third party service. Hopefully if this is an unavoidable bug it will be fixed soon. — James Whiteley, May 18 '21 at 16:51

score 0 · Answer 1 · answered Sep 28 '21 at 09:49

I also encountered the problem. I have a PWA in which images are shown and below the image there is a download button. When having simply assigned the image URL directly to the href of the download button, iOS (latest as of September 2021) did not show any "done" button or the reload icon.

What worked for me is below:

fetch('https://somedomain.tld/somefile.jpg')
.then(function(response) { 
    if (response.status !== 200) {
        alert('An error has occured (' + this.status + ')!');
    } else {
        response.blob().then(function(blob) {
            var objectURL = window.URL.createObjectURL(blob);
            document.getElementById('yourimageid').src = objectURL;
            document.getElementById('yourdownloadlinkid').href = objectURL;
        });
    }
});

How to download image from PWA in Safari iOS13+

1 Answers1

Linked