はりをきば

そこにピカマンがいる限り 私はテイッハットウッをやめない

MP3やテキスト、PDFをブラウザで開かず(右クリックを使わず左クリックで)ダウンロードさせる方法

¯注意
この記事はを最後に更新されていない。
更新日が1年以上前の記事はリンク切れしていたり、情報としては役に立たなくなっている可能性あり。
ˆMixed Contentについて
この記事は投稿日が古い為、記事中の画像は非SSL(http://)で貼られている。(※投稿画像以外は全てSSL)
この件に関して詳しくはこちらを参照。

+IE9以降でZIPやMP3のダウンロードダイアログを綺麗(?)なやつにする方法


ただの備忘録。


MP3やテキスト、動画やPDFといったファイルを
アップローダではなく直接ホームページで配布する場合、
単にファイルをうpってURLを開いてもダウンロードダイアログが出ずに
ブラウザで直接表示*1されてしまう。


それを防ぎ、DLダイアログを出す方法をggるとよくHITするのが
以下のような、.htaccessにMIMEタイプを再定義する方法。

AddType application/octet-stream .mp3 .mp4 .pdf .txt


いや、まぁ、IE9以降以外はこれで何ら問題ないのよ。IE9以降以外は。


逆に言えばIE9以降はちょっと特殊で、octet-streamが定義されているファイルにアクセスすると
こんな感じのダイアログでDLを確認してくる。

f:id:HARINEZUMI:20121206230834p:plain
個人HPで配布されてるZIPをクリックした時によく見られるダウンロードダイアログですな。


ホームページというものを初めて開設し
初めてHPにZIPをうpって公開して
初めてIE9以降でテストDLした経験のある人*2なら一度は思うでしょう。
何でうちの鯖のDLダイアログはうpロダみたいなダイアログじゃないのかと。
(いや、思わないか。普通は。)




それを解決するには、やはり.htaccessを使う。
と言っても変えるのはMIMEタイプではなく、HTTPヘッダ。


以下のようにFilesで対象ファイル若しくは拡張子を指定し、
指定したファイルにContent-Disposition attachmentというヘッダを付加する。

<Files TEST_DATA.zip>
	Header set Content-Disposition attachment
</Files>
<Files *.zip>
	Header set Content-Disposition attachment
</Files>


複数の拡張子を指定したい場合、FilesMatchで一括指定する。

<FilesMatch "\.(mp3|mp4|pdf|txt|zip)$">
	Header set Content-Disposition attachment
</FilesMatch>


これで、ダイアログではなく世間一般のアップローダからDLした時と同じような
黄色のメッセージバーとしてDL確認されるようになる。
f:id:HARINEZUMI:20121206233607p:plain

注意

attachmentヘッダは必ずFiles(FilesMatch)の中に書くこと。
そのまま書くとそのディレクトリ含む以下のファイル全て
HTML含め全部ファイルとしてダウンロードされるという惨劇がおきる。


もしくは、DLさせたいファイルだけを置く専用ディレクトリを作り
そのディレクトリの.htaccessに直にattachment文を書く。

【追記】

…何か勘違いしてる人が出てきた為、一応説明しますが
上記の<Files>というのは .htaccess への記述であり、
HTMLタグではありません。


HTMLタグやJavaScriptだけでMP3やテキストをファイルとしてDLさせるのは不可能です。
(そういうキーワードでこの記事に辿り着く方がチラホラいるので…)
上述の通り、HTTPヘッダを弄らないとブラウザの挙動は変えられません。


.htaccessもロクに使えないようなホームページスペース(ジオシティーズや忍者など)を使っているなら
そんなところはとっとと見切って即急にFC2、デジデジ、ウェブクロウなど別のところに乗り換えましょう。
格安でも良いので出来れば大手有料レンタルサーバーの方が後々後悔せずに済みます。



ダイアログとメッセージバーの違い

octet-streamのダイアログとattachmentのメッセージバーは
単に見た目が違うだけじゃない。その後行われる処理や挙動も違う。


最初に貼った画像のようなダイアログタイプのDLウインドウは
ブラウザ最前列にアクティブウィンドウとして現れ邪魔なだけでなく、
「開く」や「保存」「名前を付けて保存」を押したその瞬間から
ファイルのダウンロードが始まる。


それに対し、2枚目の画像のようなメッセージバータイプのDL確認は
今見ているページの下に邪魔にならないサイズで表示され、
確認メッセージが出た瞬間からファイルのDLが(バックグラウンドで)開始される。


attachmentの大きなファイルのDLボタンを押し、確認メッセージが出ても放置して
しばらくした後に「保存」(開く)すると一瞬でDL完了するのがその証拠。



余談

しっかし、マイクロソフトの考えることはホントよくわからん。
何でこんな意味不な仕様にすんのかね?w

*1:音楽や動画ならPCにデフォルト設定されてるプレーヤーで再生

*2:どんな人だよw