3

Rangeリクエストを介してサーバーからファイル（mp4、mp3は関係ありません）をロードする<video>and要素があります。<audio>

ただし、要素はサーバーから最後の範囲のみを要求しているようで、それ以降はバイト 0 から最後まで直接ストリーミングしようとするため、プレーヤーが「ダウンロード ループ」に陥り、ブラウザーがすべてを一時停止します。ダウンロードが完了するまで他の操作を行います。

範囲リクエスト 1

範囲リクエスト 2

この問題の解決策を知っている人はいますか? たとえば、ストリーム リクエストの実際の末尾をcontent lengthorにする必要がありaccept-rangesますか?

Chrome からの完全なリクエスト リストを次に示します。下部にはview?watch=v__AAAAAA673pxX、基本的にelement.

全範囲のリクエスト履歴

簡単に言うと、リクエストを使用すると、html5 要素がダウンロード ループに陥り、http-range他のすべてのリクエストが「保留中」のままになります。

アップデート

問題はサーバー側で解決されました。

元のストリーム関数は文字通りすべてのバイトを出力しますが、実際のバッファーのサイズのみを出力するようにコードを変更しました。これelementsにより、残りのデータに対して新しい要求が行われます。

ここでの重要な注意点は、ファイルのサイズ、各リクエストの開始位置と終了位置に一致するcontent-lengthとaccept-rangesを返すことです。content-rangesHTTP RANGE

今後の参考のために：

function stream(){
    $i = $this->start;
    set_time_limit(0);
    while(!feof($this->stream) && $i <= $this->end) {
        $bytesToRead = $this->buffer;
        if(($i+$bytesToRead) > $this->end) {
            $bytesToRead = $this->end - $i + 1;
        }
        $data = fread($this->stream, $bytesToRead);
        echo $data;
        flush();
        $i += $bytesToRead;
    }
}

新しいストリーム機能:

function stream()
{
    //added a time limit for safe-guarding
    set_time_limit(3);
    echo fread($this->stream, $this->offset);
    flush();
}
4

1 に答える 1

4

1M バイトのビデオがあるとします。初めてビデオをブラウザで要求すると、次のようなヘッダーが送信されます。

Host:localhost
Range:bytes=0-

範囲ヘッダーbytes=0-は、ブラウザーがサーバーに、返せるものまで返すように要求していることを意味します。終了位置が指定されていません

このサーバーには通常、範囲コンテキストを保持するために最後のバイトを除くファイル全体で応答します

Accept-Ranges:bytes
Content-Length:99999
Content-Range:bytes 0-99999/1000000

ここで、動画が 30% までダウンロードされ、70% を目指しているとします。ブラウザはパート ヘッダーが次のようになることを要求します。

Host:localhost
Range:bytes=700000-

ただし、要素はサーバーからの範囲の終了のみを要求しているようです。

ビデオ部分の開始位置だと間違って推測していることがわかります

サーバーは次のように応答する可能性があります

Accept-Ranges:bytes
Content-Length:300000
Content-Range:bytes 700000-99999/1000000

Content-Rangeファイルのどの部分が明示的に示されていることに注意してください。サーバーがこの情報を送信しておらず、ブラウザーがバグを起こしていると思います。また、MIME タイプが問題を引き起こす場合もあります。たとえば、ファイルの正確な MIME タイプを使用してみてくださいContent-Type: video/mp4。使用するContent-Type: application/octet-streamと、範囲ヘッダーが無効になる圧縮が発生する可能性があります

于 2017-01-07T15:11:15.437 に答える