2011-06-28 10 views
0

私は自分のサーバーへのhtmlインターフェイスを持っています。インターフェイスにボタンがあります。ユーザーがボタンをクリックすると、サーバー上にあるファイルがダウンロードされます。Javascriptのダウンロードボタンのベストプラクティス実装は何ですか?

私の現在の実装では、ユーザーがボタンを押すと、HTMLドキュメントにiframeが追加されます。 iframeのurlパラメータは、サーバー上のファイルのURIに設定され、表示パラメータは「none」に設定されています。ドキュメントの本文に追加されます。

私の質問は、このような結果を達成するためのベストプラクティスは何ですか?つまり、ボタンハンドラはダウンロードをどのように管理する必要がありますか?

window.location.href = <download URL>;

+0

iframeに問題がある可能性はあまりありません。あなたのキャラクターエンコーディングの問題以外に、私はあなたがやっていることに間違ったことは何も見ません。ここで「安全な」とはどういう意味ですか? – Pointy

+0

問題は、私が経験している問題ではなく、そのようなダウンロードボタンを実装するためのベストプラクティスに関するものでした。私はこの影響についての質問を編集しました。 –

+0

なぜこの複雑な方法で行くのですか?いくつかのPHPでこれを行い、ブラウザにファイルをダウンロードさせるようにヘッダを設定することができます。 – petsoukos

答えて

2

ベストプラクティスは、ボタンでフォームを使用することです。例:

<form method="get" action="/file-to-download.zip"> 
    <div> 
    <input type="submit" value="Download" /> 
    </div> 
</form> 

あなた本当にが、それはIFRAMEをターゲットにする必要がある場合(arothが説明したように、不必要なようです - あなたは常に認識タイプのためのContent-処分レスポンスヘッダを設定することができます)、あなたはtarget="myIFrame"を置くことができますあなたのフォームのタグ(myiframeはあなたの隠れたIFRAMEの名前です)。

実際、Content-Disposition response headerは、ファイルが開かれるのではなくダウンロードされることを保証するために、ベストプラクティスです。

3

理由だけのような何かをしませんか?

これはどんなブラウザでも動作するはずです。ダウンロード可能なコンテンツが(ブラウザに表示されているものの観点から)あなたのウェブページから離れていても、ブラウザはそれ自体をレンダリングしようとします(例えば、image/pngのように)。

+0

Chrome Html 5ビデオこのアプローチでネットワークエラーが発生しましたが、これを回避する方法はありますか? – DevDave

関連する問題