Javascript複数のファイルをダウンロードするためにループ経由でiframe srcを更新する

Question

私の目的は、1回のリクエストで複数のファイルを同時にPHPでダウンロードすることです。私はファイルを圧縮するために 'ジップ'ソリューションを使用することはできません。だから私が思いついた解決策は、iframeが複数のファイルをダウンロードするように、空のiframeを持ってソースを動的に更新することでした。

私はIFRAMEで基本的なページを持っていると、ユーザーがクリックしたとき、彼らはそれをダウンロードしたファイルは、選択したファイルをループし、1つのファイルをダウンロードするPHPページにiframeのソースを更新するスクリプトを実行します：

リクエストを送信しページ：

<script> 
function download_files(){ 
    // assume this is a loop which finds out all the files which were selected by the user 
    for (var i = 0, len = selected_fileids.length; i < len; i++) { 

     var fileid_single2 = selected_fileids[i].split("select_"); 
     fileid_splitted = fileid_single2[1]; 

     document.getElementById('iframe_downloader').src = "/index.php?page=download&fileid=" + id; 

    } 
} 
</script> 


<iframe src="" style="width:0;height:0;border:0; border:none;" id="iframe_downloader"></iframe>"; 

<!-- assume there will be checkboxes here which lets the user pick their files --> 

<p onclick="download_files();">download</p> 

PHPのダウンロードスクリプトは、$ファイルパスとファイル名$を想定し、正しい値があります。

を

基本的に、スクリプトは選択したすべてのファイルをループし、ソースを変更してiframe経由ですべてのファイルをダウンロードします。 問題は、最後のファイルを実際にダウンロードしているように見えることです。デバッグしようとしましたが、処理がconsole.logできるので、すべてのアイテムがループしていることがわかります。ただし、最後のファイルだけがiframeによって実際にトリガーされています。

私はsetIntervalを追加しようとしましたが、それはどちらも良いことではありません。私はフィドラーを見て、私は最後のファイルがトリガーされていることを確認することができます。

Answer 1

ダウンロードごとにiframeを作成できます。

<script> 

function createFrame(url) { 
    var frame = document.createElement("iframe"); 
    frame.setAttribute("src",url); 
    frame.style.width = "0"; 
    frame.style.height = "0"; 
    frame.style.border = "none"; 
    document.body.appendChild(frame); 
} 

function download_files() { 
    var len = selected_fileids.length; 
    for (var i = 0; i < len; i++) { 
     var id = ....<incomplete original code>....; 
     createFrame("/index.php?page=download&fileid="+id); 
    } 
} 

</script> 

<a href="#" onclick="download_files();return false;">download</a> 

私はこのコードがテストされていないことを警告しなければならないが、それだけで考えを示しています。これは、JavaScriptでのソリューションです。