javascript - ブラウザーがファイルを要求し、サーバーが pdf をダウンロードし、ブラウザーが iframe で pdf を表示する

Question

これが私がやりたいことです: 1) ブラウザがサーバーに ajax リクエストを開始し、pdf を要求します。2) サーバーは pdf をダウンロードし、表示用に pdf を返します。3) ブラウザーは、ダウンロードした pdf を既存の iframe に表示します。

以下は私のコードです。iframe 部分で止まっているように見えますが、pdf が正しく送信されていないのではないかと思います。

ブラウザの index.html ファイル:

var uri = '/viewer/loaddrawing/';
$.getJSON(uri, {key:value}, function(data, jqXHR){
    document.getElementById("iframetitle").src = uri;               
});

Django サーバーの views.py ファイル:

import requests
def loaddrawing(request):
    value = request.GET.get('key')
    #the key is used to generate a unique url, but for test purposes lets use the url shown below
    url = "http://cbmeturkey.com/media/109/test.pdf"
     response = urllib2.urlopen(url)
     some_data = response.read()
    return HttpResponse(some_data, mimetype='application/pdf')

編集：

問題が 1 つあります。実際に pdf をダウンロードして再度使用したいので、index.html ファイルで以下のコードを使用したくありません。これは、私の index.html ページが javascript を使用して iframe を表示および非表示にするためです。以下のコードでは、iframe が表示されるたびに pdf が再ダウンロードされます。

var uri = '/viewer/loaddrawing/';
document.getElementById('iframetitle').src = uri + '?key=' + value;

解決済み: 上記の問題は、Augusto からの指示と、pdf を 1 回だけ読み込む次の index.html コードにより解決されましたが、iframe ではなく div (「divtitle」という名前) を変更していることに注意してください。

var uri = '/viewer/loaddrawing/' + '?key=' + value;
var htm = '\<iframe src="' + uri +'" onload="downloadComplete()">\</iframe>';
document.getElementById('divtitle').innerHTML = htm;