iframe経由でファイルをダウンロードする際にChromeエラーが発生しました

Question

サーバーにJSONデータを送信しています。サーバーはPDFファイルを生成し、そのPDFファイルへのURLで応答します。次に、PDFファイルをダウンロードするためにサーバーに別の要求を行います。ダウンロードを行うには、非表示のiFrameを作成し、ソースにPDFのURLを設定します。ユーザーのブラウザを同じページに置き、バックグラウンドでダウンロードしたいと考えています。私がやっていることと私が行った解決策の詳細はthis SO questionにあります。

この方法をChromeで使用するときは、すべてうまく動作します。しかし、クローム開発者コンソールを見ると、エラーメッセージFailed to load resourceが表示されます。 私はこれらのエラーを取得しないようにこれを別の方法で行う方法はありますか？

非常にシンプルで機能しているexample of the problem in actionがjsfiddleで確認できます。 [PDFをダウンロード]ボタンをクリックしてChromeコンソールをご覧ください。

、そのページ上のコードは次のようになります

：

$(document).ready(function() { 
    var downloadFile = function(url){ 
     var iframe = $("iframe#download"); 
     if (!iframe.length) { 
      iframe = $("<iframe id='download' style='display:none;'/>"); 
      $("body").append(iframe); 
     } 
     iframe.attr("src", url); 
    }; 

    $("button").click(function() {  
     downloadFile("http://www.education.gov.yk.ca/pdf/pdf-test.pdf"); 
    }); 
}); 

Answer 1

他の回答者も同様にうまくいくはずですが、ブラウザーに対処方法を指示する特定の応答ヘッダーがあります。ファイル。

次は、ダウンロードしたのではなく、ブラウザに表示されるPDFファイルを強制する必要があります。

の「Content-処分：添付ファイル;ファイル名= [ファイル名]」

Answer 2

がdocument.readyの外であなたの関数を移動...

一般的な機能は、常に外にする必要があります...そしてそれwhereeverと呼ばれるべき

$(document).ready(function() {  

    $("button").click(function() {  
     downloadFile("http://www.education.gov.yk.ca/pdf/pdf-test.pdf"); 
    }); 
}); 

    var downloadFile = function(url){ 
      var iframe = $("iframe#download"); 
      if (!iframe.length) { 
       iframe = $("<iframe id='download' style='display:none;'/>"); 
       $("body").append(iframe); 
      } 
      iframe.attr("src", url); 
     }; 

Answer 3

を必要とされている私は自分自身のWebサーバー上の1つに、ファイルのSRCを変更し、「アプリケーション/オクテットストリーム」の代わりに「APPLICにレスポンスヘッダの「コンテンツタイプ」を設定しますation/pdf "をダウンロードし、Chromeで正しくダウンロードしました。私はエラーがまだコンソールに表示されていることを指摘しておきますが（ "Error loading resource"）、ファイルをダウンロードするよう促しました。

Answer 4

これは私の頭の一番上にあります。以前は同じ問題にぶつかってきたと思います。 iframeがdomに最初に追加されると、srcはありません。これにより、Chromeは「FAIL TO LOAD RESOURCE」になります。インラインフレームに初期SRCを追加

TRY -

iframe = $("<iframe id='download' src='about:blank' style='display:none;'/>"); 

私は信じてそれを行う必要があります。 （間違っていると何百回も私にdownvoteすることができます:)）

Answer 5

Chromeが組み込まれているPDFビューア。 iframeのsrcを設定すると、ChromeはPDFファイルを表示しようとします。 display:noneに設定されているため、ダウンロードがキャンセルされ、そのメッセージが表示されます。

displayをnone以外に設定して、position:absoluteでiframeを画面から外します。

Answer 6

var downloadFile = function(url){ 
    var iframe = $("iframe#download"); 
    if (!iframe.length) { 
     iframe = $("<iframe id='download' style='display:none;'/>"); 
     $("body").append(iframe); 
    } 
    iframe.attr("src", url); 
    iframe.on('load',function(){ 
      console.log("error") 
    }); 
}; 

Uはただ、これを試すことが取り組んでいる、しかし、これは、この問題を解決する正しい方法ではありません...