.jpg.png.gif.pdf等々をHTML5でダウンロードさせる方法 [PHPもJavascriptも不要]

HTML5 プレースホルダーにスタイルを付ける
このエントリーをはてなブックマークに追加
PR

ブラウザで開くことが出来るファイルはリンクにするとダウンロードではなくて、ページとしてファイルが開かれてしまいます
通常 画像等を通常のリンクとしてダウンロードさせることが出来ず別ページに送ってPHPで処理をさせるとう形になるのですが、他にはZIP化したりと

でも
HTML5だけでダウンロードさせることが可能なんです!

 

aタグにこれを追加するだけ

<a class="download" href="img/apple.jpg" download="">

download=”” を追加するだけでファイルを開かずにダウンロードさせることが出来ます
download=”photo.jpg”とすれば ダウンロードするときにファイル名を指定することが出来ます

ただ対応ブラウザが限られていて
試した所 Chrome、Opera、firefoxのブラウザでは動作しました

残念ながらIE、safariでは普通のリンクとしてしか機能しません

(※IEは11では試していません)

 

それでもChrome、Opera、firefoxでダウンロードさせることができるので価値があると思います
IEとsafariもそのうち対応していくだろうと考えられるので、この方法でダウンロードさせるようにしていけば将来的に何か作業が増えるわけでもないのでいいのではないかと思います

あとはこの仕様がスタンダードになるのを待つだけです

 

ファイルをZIP化することでリンクするだけでダウンロードさせれるように出来るのですが
ZIP化するのも面倒だしファイルの管理も増えるし、PHPでやるのも専用のページ作ったりで作業増えるしって事で、作業量も殆ど増えずこの方法が個人的にはベストな気がします

 

 

参考になったページ

http://www.workabroad.jp/posts/856

PR

COMMENT

コメントを残す

PR

9ineBBの管理人が運営するサイト

WDG WEB DESIGN GALLERY ウェブデザインギャラリー CC0 PHOTO 無料で使える高画質な写真をダウンロード、クレジット表記、リンク不要

9ineBBの最新情報をチェック・購読

Twitter Facebook Google+ Feedly RSS

どこをクリックしてもこの表示を消せます
(3日後以降に再度表示されます)