8

作成したC#Webサーバーからpngファイルに対してjavascriptxhrリクエストを実行したいと思います。これが私が使用するコードです

    var imgUrl = "http://localhost:8085/AnImage.png?" + now;
    var request = new XMLHttpRequest();
    request.open('GET', imgUrl, false);
    request.send(); // this is in a try/catch

サーバー側で、ファイルを送り返し、Content-Dispositionヘッダーを追加します。次のような回答が得られました

Firebugを使用して、応答で取得されたヘッダー

Content-DispositionがContent-Typeの後にヘッダーに添付されていることを確認しました(スクリーンショットはFirebugのもので、アルファベット順に追加されています)。

その結果、ダイアログボックスはトリガーされませんが、応答に何かが欠けていますか?

編集:私はいくつかの理由でJavaScriptですべてを実行したいと思います。まず、画像を表示したくないので、すべてをカーテンの後ろに置きたいと思います。2番目:画像をリクエストするとき、特定のリクエストでのみContent-Dispositionを追加したいと思います。このようなリクエストは、値が「AttachmentRequest」の「Warning」ヘッダーでマークされます。

request.setRequestHeader("Warning","AttachmentRequest");
4

1 に答える 1

10

Content-DispositionリクエストがXHR経由の場合、ファイル保存ダイアログがトリガーされるとは思いません。XHRを使用すると、結果をコードで処理することになります。

ユーザーに画像をファイルに保存するように求めるプロンプトを表示する場合は、この手法を正常に使用しました。

window.open("http://localhost:8085/AnImage.png?" + now);

ヘッダーが到着するまで空白の開いているウィンドウが短時間点滅し、その後新しいウィンドウが閉じて[ファイルを保存]ダイアログボックスが表示されるという欠点があります。

を使用するiframeと、ウィンドウの点滅を防ぐことができます。

var f = document.createElement('iframe');
f.style.position = "absolute";
f.style.left = "-10000px";
f.src = "http://localhost:8085/AnImage.png?" + now;
document.body.appendChild(f);

これとは別に、要素Content-Dispositionの処理に(もしあれば)どのような影響があるのだろうか。img

var img = document.createElement('img');
img.style.position = "absolute";
img.style.left = "-10000px";
img.src = "http://localhost:8085/AnImage.png?" + now;
document.body.appendChild(img);

私はそれを試していませんが、ブラウザはヘッダーを尊重するかもしれません。サポートするすべてのブラウザで必ずテストする必要があります。

于 2012-12-18T09:34:20.257 に答える