HTML5ファイルブレークポイント更新方法の実装

HTML5のファイルAPIには、BLOBオブジェクトに分割できるスライスメソッドがあります。フロントエンドは、ファイルリストオブジェクトを介して対応するファイルを取得します。

現在、一般的に使用されるブレークポイントは、WebSocketインターフェイスを介してファイルをアップロードすることです。インターフェースは、ブレークポイントをアップロードするというアイデアを示すための比較的便利なAjaxです。

言い換えれば、ブレークポイントのコアコンテンツはファイルをスライスしてから再びサーバーに渡すことですが、一見単純なアップロードプロセスには無数のピットがあります。

1つ目は、ファイルがいくつかの部分に分割された後、サーバーにいくつのピースをカットしたか、最終的なサーバーにマージする方法です。

したがって、ファイルがアップロードを開始する前に、サーバーにハンドシェイクプロセスがあり、サーバーの情報を通知し、サーバーでコンセンサスに到達した後、セクションのサイズに同意しました。伝染 ; 感染。

フロントデスクは、後続のブレークポイントの場合、フロントとバックエンドを識別する必要があります。

ファイルの送信が中断された後、ユーザーはファイルを再度選択して、もしそうなら、ファイルがアップロードされているかどうかを判断します。

HTML5のファイルAPIを使用すると、切断ファイルは想像よりもはるかに簡単です。

スライス方法を使用するだけです

var packet = file.slice（start、end）;

パラメーターの開始は、スライスの開始の位置です。開始と終了を制御することにより、ファイルの別のブロックにすることができます

のように：

 file.slice（0,1000）;

前のものでは、次に行う必要があることを介してファイルをいくつかの部分に分割しました。

ここでは、AjaxのPOSTリクエストを使用して実装します

var xhr = new xmlhttprequest（）; var url = xxx //ファイルによってアップロードされたアドレスは、ファイル名の数など、ファイルのパラメーターを含めることができます。 ; xhr.onload = function（e）{//次のピースを正常にアップロードし続けるかどうか、} xhr.upload.onprogress = function {//メソッド単一のフィルムファイルの特定のアップロード進行を決定// E.ロードファイルがアップロードされている金額。

ファイルがバックグラウンドにアップロードされた後、バックグラウンドプログラムはそれに応じて処理されます。