次のコードのようなものを使用して、動的に生成されたレポートを新しいタブで開くアプリがあります。(デモのためにパラメータをモックアウトしました。)
function gblPDFWdw(pdf) {
var formDiv = document.createElement("div");
formDiv.innerHTML = "<form method=post action='" + pdf + "' target='_blank'><input type=hidden id=test name=test value='test'></form>";
var form = formDiv.firstChild;
document.body.appendChild(form);
form.submit();
form.parentNode.removeChild(form);
}
パラメータはpdf
、PDF を生成するスクリプトへの URL です。操作の理由は、パラメータとしてではなく、スクリプトに渡されform
たパラメータを取得するためです。POST
GET
IE 8 以下、Chrome、Firefox などでは、これは次の 2 つのいずれかを行います。
- ブラウザーが (組み込み機能またはプラグインを介して) PDF を読み取ることができる場合、レポートを含む新しいタブが開きます。これは望ましい動作です。
- ブラウザーが PDF を読み取れない場合、新しいタブが開き、すぐに閉じて、ファイルがダウンロードされます。
#2 は IE 9 以降で変更されたようです。新しいタブが開きますが、ユーザーが元のタブに戻って [開く] または [保存] をクリックし、PDF が期待どおりにダウンロードされるまで、空白の画面しか表示されません。非常に紛らわしいインターフェースです。
これを回避する方法の 1 つは、一時 PDF ファイルを生成してから window.open() することだと思います。この機能の動作を微調整する他の方法はありますか? または、私が遭遇したことのない推奨される方法はありますか?
(注: これは PDF 固有のものではありません。ブラウザーがネイティブに表示する代わりにダウンロードする可能性のあるファイルには問題があるようです。)
編集:私が思っていたよりもさらに遅れているようです。これはIE9でも発生するようで、PDFプラグインをインストールせずに、または別のファイルタイプで試したことがないので、気づきませんでした.
興味深いことに、上記のコードは、フォームからフィールドを削除した場合と同じように機能します。input
ブラウザがそれを別の方法で処理する理由がわかりません。もちろん、私の場合、POST
スクリプトへのデータへの入力が必要です。
EDIT 2:ばかげた間違い。input
自己閉鎖です。修理済み。
EDIT 3:問題をよりよく説明するためのスクリーンショットをいくつか示します。この JSBinをテストに使用しています。上記の Javascript 関数をトリガーする onclick イベントがあります。
プロセスは最初のタブから始まります。
次に、テキストをクリックすると、新しいタブが開きます。しかし、それは空白です!
そして、元の(現在は非表示になっている) タブに、ファイルを開くか保存するかを尋ねるメッセージがあることがわかりました。
「開く」または「保存」をクリックすると、問題なくファイルが開きます。しかし、このプロセスは非常にややこしく、他のブラウザと一貫性がありません。
EDIT 3 : 一歩前進、一歩後退。を使用window.open()
して新しいウィンドウを作成し、プログラムform.target
で をそのウィンドウの名前に設定すると、少なくとも開いたタブで開く/保存メッセージを取得できますが、他のタブと同じようにすぐにタブを閉じることをお勧めしますブラウザ。さらに悪いことに、その手法では、新しいタブがすぐに閉じなくなります。ひょっとしたら、別のテクニックがあるのではないでしょうか?