如何在Safari iOS13+中从PWA下载图片 [英] How to download image from PWA in Safari iOS13+

问题描述

我正在尝试实现从PWA下载图像。我正在使用

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

实现这一点。我擅长使用桌面Chrome和Safari，以及Android版的Chrome。但当我在Safari iOS 13上处于独立模式(PWA)时，我无法关闭为保存文件而打开的窗口。在iOS 12上有一个‘完成’按钮和图像预览。

我尝试了here中的解决方案。但未成功；Safari阻止了window.open()。

推荐答案

我也遇到了这个问题。我有一个显示图像的PWA，图像下面有一个下载按钮。当直接将图像URL分配给下载按钮的HREF时，iOS(截至2021年9月的最新版本)没有显示任何完成按钮或重新加载图标。

对我有效的方法如下：

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;
        });
    }
});             

这篇关于如何在Safari iOS13+中从PWA下载图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！