web-dev-qa-db-ja.com

ダウンロード属性がサファリで機能しない

リンクでダウンロード属性を使用しています：

   <a style="color:white" download="myimage" href="images/myimage.jpg">Download image</a>

ほとんどすべてのブラウザーで非常にうまく機能しています。つまり、リンクをクリックすると、画像が自動的にダウンロードされます。 Mac上のsafari 10.1.2でテストしましたが、正常に動作しています。

しかし、safari 10.0.3で動作している友人のMacでは動作しません。彼は、画像は新しいウィンドウで開くだけで、ダウンロードしないと言っています。

なぜこれが起こっているのですか？どこでも動作させるにはどうすればよいですか？

htmlmacosdownloadsafariattributes
11
peace_love

https://developer.Apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_1.html によると、Safari 10.1で追加されました。

HTML5ダウンロード属性アンカー要素のダウンロード属性は、リンクターゲットがナビゲーションリンクではなくファイルをダウンロードするダウンロードリンクであることを示します。ダウンロード属性を持つリンクをクリックすると、ターゲットがファイルとしてダウンロードされます。オプションで、ダウンロード属性の値は、ファイルの推奨名を提供します。

私のテストではiOS Safari 11.1では利用できないようですが、少し混乱しています。類似したバージョン番号に基づいて、標準サポートが同等になると期待しています。

12
IGx89
try this code : 

var element = document.createElement('a');
            var clearUrl = base64.replace(/^data:image\/\w+;base64,/, '');

            // element.setAttribute('href', 'data:attachment/image' + base64);
            element.setAttribute('href', 'data:application/octet-stream;base64,' + encodeURIComponent(clearUrl));
            element.setAttribute('download', 'filename.jpg');
            document.body.appendChild(element);
            element.click();
            document.body.removeChild(element)

これはサファリバージョン10.0.3での作業です

3
mayur kukadiya