1

プログレスバー付きの XMLHttpRequest を使用してファイルをダウンロードする次のコードがあります。

編集:

目的は、ギガビット速度と一般的な 10 Mbps 接続の違いを実証することです。ユーザーは、大きなビデオ ファイルを 1 つにまとめて Mac にダウンロードします。

ページにプログレス バーが表示され、数秒でファイルがディスクに保存されます...その後、ユーザーはハードウェア スイッチを 10Mbps に制限して再度ダウンロードを有効にします。今回は、330MB ファイルの転送を確実に中止します。

PHP (download.php):

<?
    $file='/path/to/some/video.mp4';

    header('Content-Description: File Transfer');
    header('Content-Type: video/mp4');
    header('Content-Disposition: attachment; filename='.basename($file));
    header('Content-Transfer-Encoding: binary');
    header('Content-Length: ' . filesize($file));
    header('Expires: 0');
    header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
    header('Pragma: public');
    ob_clean();
    flush();
    readfile($file);
?>

JavaScript:

var req = new XMLHttpRequest();
req.onprogress=updateProgress;
req.open('GET', 'download', true);
req.setRequestHeader("Content-Type","video/mp4");
req.onreadystatechange = function (aEvt) {  
    if (req.readyState == 4) {
        ...
    }
};  
req.send();

function updateProgress (evt) {
    console.log(evt);
    var percentComplete = Math.round(evt.loaded * 100 / 330581733);
    $('#downloadProgress').val(percentComplete);
    $('#progressVal').html(percentComplete.toString() + '%');
}

私のリクエストには、 $filsize がエコーされたときに... 330581733 (330MB といくつかの変更) を読み取る Content-Length を除くすべてのヘッダーが含まれています。私の進行状況関数は、テスト目的で正確な数値を使用しますが、evt.total にする必要があります。

パート 1: Content-Length ヘッダーが利用できないのはなぜですか?

パート 2: ダウンロードが完了したら、なぜ開かないのですか? どこに行くのですか?

4

1 に答える 1