2

サーバー（node.js）に保存せずに、あるクライアントブラウザーから別のクライアントブラウザーにファイルを送信する必要があります。HTML5とFile APIを使用してファイルを送信するにはどうすればよいですか？

実際に実装されたソリューション：

最終的な解決策は次のようになります。

  1. クライアントのシード時に、input [type=file]からファイルを取得します

  2. ファイル配列には、ファイルObjectを格納するキーが含まれています。スライス/mozSliceメソッドを使用してチャンクを分割し、Object.sliceがBlobオブジェクトを返すようにします。

  3. FileReader Blobを使用すると、生のバイナリデータまたはbase64でエンコードされたデータに読み込むことができます。FileReaderは、base64に読み取るためのreadAsDataURL（blob）と、生のバイナリデータに読み取るためのreadAsBinaryString（blob）を実装します。BLOBから読み取られたデータにアクセスするには、「onloadend」FileReaderイベントを参照してください。

  4. チャンクサイズ（通常は1024 * 64）と次のスライスの開始/停止位置に従ってチャンク数を計算するロジックを実装して、まったく同じサイズのチャンクを取得する必要があります

  5. エンコードされたデータはsocket.ioを介してnode.jsに送信されます。サーバー側のロジックは、受信したデータを、socket.ioを介して接続されたpearに送信することだけです。

  6. 最も興味深いのは、これらすべてのチャンクをpearのクライアントブラウザーでblobにまとめることです。生のバイナリデータからBlobを作成すると、blobのサイズが正しくなくなり、ファイルサイズが正しくなくなります。そのため、base64でエンコードされたデータをシーダーから転送しています。
    デコードは自分で実装する必要があるため、問題になる可能性があります。

    function decode64 (data) {
    var mimeString = data.split(',')[0].split(':')[1].split(';')[0],
    // remove all chars before ','
    byteString = atob(data.split(',')[1]),
    // if BlobBuilder available
    ab = new ArrayBuffer(byteString.length),
    ia = new Uint8Array(ab);

    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }
    blob    = new Blob([ia], {'type' : (mimeString) });
return blob;
}

データをblobにデコードしたら、別のデコードされたチャンクを含む配列にプッシュする必要があります。7.ブロブにデコードされたチャンクの配列からブロブを作成します。

new Blob (array_of_decoded_blobs_returned_by_decode64_function, {type:'mime-type'})

file apiを使用してblobをファイルに書き込むか、やりたいことを何でもします

4

2 に答える 2

2

Websocketは私がこれを行うことを想像できる唯一の方法であり、サーバー側のプロキシが必要です。

参照：WebSocketはp2p（ブラウザーからブラウザー）通信を可能にしますか？

于 2013-02-28T21:14:35.783 に答える
1

webrtcをチェックしてください。ファイルをブラウザに直接送信できます。サーバーは、あるクライアントブラウザに別のクライアントブラウザの「アドレス」についてのみ通知します。

于 2013-09-11T08:52:33.947 に答える