Dance with Tech

プログラミングとか学んだことの備忘録ブログです。

ナウでヤングなHTML5を使ってサクッとファイルをダウンロードさせる

この記事は「1分で実現できる有用な技術 Advent Calendar 2014」の 18日目の記事です。

Qiitaで催されているアドベントカレンダーに参加してみました。

 

本題

何かの機能を作っていて、ユーザーにファイルをダウンロードさせたいときがあると思います。

そのときに、PHPのheaderとかreadfileを使ってDLさせるのも良いのですが、もっとサクッと出来ます。

※僕は一応PHPerなのでPHPを例にしました

 

方法はイケイケでナウでヤングなHTML5を使います。

f:id:kmatz90:20141218001411p:plain

そして、a要素のdownload属性を使います。

これだけ。

 

さらに、downloadの属性値は省略できます。

省略した場合、ファイル名がダウンロード時のファイル名になります。

マジでナウでヤングだわ。

 

がしかし

対応しているブラウザが「Google Chrome」、「Firefox」、「Opera」のみという何とも絶妙な仕様。

社内システムとかで、使っているブラウザが決まったりしている場合などに使える小技です。

 

HTML&CSS標準デザイン講座 【HTML5&CSS3対応】

HTML&CSS標準デザイン講座 【HTML5&CSS3対応】