ファイルを表示せずにダウンロードする方法
小粋空間 » HTML » HTML5 » ファイルを表示せずにダウンロードする方法
ファイルを表示せずにダウンロードする方法を紹介します。
1.はじめに
PDFなどのファイルのリンクをウェブページに表示するには、
<a href="http://user-domain/foo.pdf">foo.pdf</a>
のような設定すると思いますが、この方法ではファイルをブラウザに一旦表示させてからダウンロードすることになります。
ファイルをブラウザに表示させずにダウンロードだけさせるようにしたいのですが、方法が分かりません。
ということで、ファイルを表示せずにダウンロードする方法を紹介します。
2.ファイルを表示せずにダウンロードする
ファイルを表示せずにダウンロードするには、a要素にdownload属性を付与して、
<a href="http://user-domain/foo.pdf" download="foo.pdf">foo.pdf</a>
とすればOKです。
download属性はHTML5で新たに規定されたものです。
またdownload属性の値は、ダウンロードするときのファイル名になります。
download属性値は省略することも可能です。
<a href="http://user-domain/foo.pdf" download>foo.pdf</a>
省略した場合、元のファイル名がダウンロード時のファイル名になります。
download属性が設定されたリンクは、ChromeやFirefoxでは正常に動作(=表示せずにダウンロード開始)しますが、IE11では動作しないようです。
ただしIE11でも表示はできるので、そこからダウンロードという手順になります。