tencent cloud

Tencent Cloud EdgeOne

ドキュメントTencent Cloud EdgeOneエッジ関数サンプル関数リソースストリーミング応答の統合

リソースストリーミング応答の統合

ダウンロード
フォーカスモード
フォントサイズ
最終更新日: 2026-10-15 18:25:51
AI翻訳
この例では、3つの動画を1つの動画に結合し、クライアント側で動画の結合順に再生します。エッジ関数を使用して複数のリモートリソースを取得し、ストリーミングで読み取り・結合し、最終的にクライアントへストリーミングレスポンスを返すことを実現しています。

サンプルコード

async function sequentialCombine(urls, destination) {
try {
各URLを順番に処理します。
for (let i = 0; i < urls.length; i++) {
const url = urls[i];

現在のフラグメントを取得します。
const response = await fetch(url);

if (!response.ok) {
console.error(`動画フラグメントの取得に失敗しました: ${url}、ステータスコード: ${response.status}`);
continue;
}

読み取り可能なストリームを取得します。
const readable = response.body;

直ちにpipeToを実行し、現在のフラグメントをターゲットストリームに書き込みます。
try {
await readable.pipeTo(destination, {
preventClose: true // 後続の書き込みに備えてストリームを開いたままにします。
});
} catch (e) {
console.error(`ストリーム処理エラー (${url}): ${e.message}`);
}
}
} catch (err) {
console.error(`動画ストリームの結合エラー: ${err.message}`);
} finally {
すべてのフラグメント処理が完了した後、ストリームを閉じます。
const writer = destination.getWriter();
writer.close();
writer.releaseLock();
}
}

async function handleRequest(request) {
// 動画フラグメントアドレス
const urls = [
'https://vod.example.com/stream-01.mov',
'https://vod.example.comm/stream-02.mov',
'https://vod.example.com/stream-03.mov',
];

変換ストリームを作成します。
const { readable, writable } = new TransformStream();

順番に動画フラグメントを取得して結合します。
sequentialCombine(urls, writable);

// 結合された動画ストリームの応答を返します。
return new Response(readable, {
headers: {
'content-type': 'video/mp4',
}
});
}

fetchイベントを監視します。
addEventListener('fetch', event => {
event.respondWith(handleRequest(event.request));
});

サンプルプレビュー

ブラウザのアドレスバーにエッジ関数のトリガールールに一致するURLを入力すると、結合された動画をプレビューできます。応答ヘッダーを確認すると、動画はチャンク方式で転送されています。




関連参考

ヘルプとサポート

この記事はお役に立ちましたか?

フィードバック