Skip to content

クイックスタート

デモをIDEにコピーし、2つのページを開いて効果を確認してください。

ドメインの紐付け

P2Pサービスを利用する前に、まずドメインを紐付ける必要があります。

TIP

Localhostはホワイトリストに登録済みのため、紐付け不要でローカルデバッグに利用できます。

事前準備

クロスオリジン設定

ファイルサーバー側でクロスオリジン設定が済んでいることを確認してください

OPTIONSリクエストを許可する

OPTIONSリクエストは、クロスオリジン環境でRANGEリクエストを送信する前のプリフライトリクエストです。通常はHTTPレスポンスヘッダーに以下を追加するだけです:

Access-Control-Allow-Methods: GET, OPTIONS

RANGEリクエストを許可する

本SDKはRANGEリクエストを使用します。通常はHTTPレスポンスヘッダーに以下を追加するだけです:

Access-Control-Allow-Headers: Range

Firefoxとの互換性

Firefoxなど一部のブラウザでは、ファイルサイズを取得するためにレスポンスヘッダーに Access-Control-Expose-Headers を設定する必要があります:

Access-Control-Expose-Headers: Content-Length

プラグインの導入

scriptタグでの導入

scriptタグで最新バージョンを導入:

html
<script src="https://cdn.jsdmirror.com/npm/@swarmcloud/file"></script>

ファイルでの導入

こちらをクリック

Browserify / Webpack

shell
npm install --save @swarmcloud/file

require を使って@swarmcloud/fileを導入:

javascript
var P2PEngineFile = require('@swarmcloud/file');

またはES6の import 構文を使う場合:

javascript
import P2PEngineFile from '@swarmcloud/file';

プラグインの使用

P2PEngineFile をインスタンス化し、ファイルダウンロードのアドレスを引数として渡します。

javascript
var downloader = new P2PEngineFile('path/to/your.file');
downloader.on('finished', function (file) {
    file.save('name.file');
    file.revokeBlobURL();    // fileが占有しているメモリを解放
});
downloader.on('failed', function (e) {
    // fallback to normal download
});
downloader.on('progress', function (e) {
    // show progress to user
});
downloader.start();

ストリーミングダウンロード

ファイルのダウンロード完了を待たずにディスクへ保存したい場合、ストリーミングダウンロード方式(ServiceWorkerベースで実装)を利用できます。ServiceWorkerをインストールしブラウザのファイルダウンロードをトリガーするために、特殊なiFrameが必要です。デフォルトのiFrameはgithubでホスティングされていますが、設定により自前でホスティングすることもできます:

javascript
var downloader = new P2PEngineFile('path/to/your.file',{
    // mitm: './mitm.html',           // https://github.com/cdnbye/file-p2p-engine/blob/master/demo/mitm.html
});
if (downloader.isSaveByStreamSupported()) {
    downloader.saveByServiceWorkerStream("filename")
        .catch(err => {
            console.error(err)
            // you need to make the fallback strategy by yourself
        });
} else {
    // you need to make the fallback strategy by yourself
}
downloader.start();

ストリーミングダウンロードのデモを参照してください

粤ICP备18075581号