問題タブ [media-source]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
1216 参照

html - HE-AAC v2 を Chrome の MediaSource API で再生するにはどうすればよいですか?

MediaSource APIを使用して、Chrome でチャンク HE-AAC v2 を再生しようとしています。

Chrome はこのコーデック ( mp4a.40.29) を明示的に許可しており、私が見る限り、それをデコードすることができます。(たとえばdecodeAudioData、Web Audio API のメソッドは同じデータをデコードします)。

残念ながら、Chrome で MediaSource API を使用して HE-AAC v2 のチャンクを再生しようとすると、まったく同じページが Safari で完全に動作するにもかかわらず、以下のエラーが発生します。

問題 (Chrome) と成功 (Safari) を示すテスト ページをまとめました。

Chrome にこれらのチャンクを再生させるにはどうすればよいですか?

エラー:

パイプライン: デコード エラー

kInitDemuxer

追加: ストリームの解析に失敗しました。データサイズ=15634 append_window_start=0 append_window_end=inf

0 投票する
0 に答える
531 参照

ffmpeg - FFmpeg - フレームレートが固定されていない断片化された MP4

Media Source Extensions で再生するために断片化された MP4 を作成しています。コマンド ラインは次のとおりです。

ビデオのソースは、H.264 をストリーミングする IP カメラです。設定された予想フレーム レートは 10 FPS ですが、10 FPS を保証するものではありません。次の問題を強調するために、10% の p フレーム ドロップをシミュレートしました。

上記のコマンドを使用すると、出力ビデオがリアルタイムよりも速く再生されます。パイプ全体がライブ ストリームであるため、これは問題です。10% フレームドロップのシミュレーションでは、実効再生速度は 1.1 倍になります。固定レートの保証がないため、固定フレームレートを義務付けたくありません。-r 10 フラグを完全に削除すると、MP4 は 2 倍から 3 倍の速度で再生されているように見えます。

MP4 タイムスタンプをより動的な方法で構築する方法はありますか? たとえば、RTP タイムスタンプを指定するか、「フィード」時間のタイムスタンプを使用して MP4 をビルドするように ffmpeg に指示しますか?

0 投票する
0 に答える
117 参照

video - Media Source Extensions - データがなくなったときの識別

一定の 10FPS でリアルタイム ライブ コンテンツの断片化された MP4 を作成していますが、MP4 作成プロセスにフィードされる前にフレームがドロップされることがあります。MP4 は、Web ソケットを介して Web に送信されます。

プレーヤーが 10FPS で再生するため、時折フレームがドロップするため、ファイルの再生速度は事実上 1x よりわずかに速くなります。これはライブ コンテンツであるため、しばらくするとプレーヤーは現在の時間に到達し、再生するデータがなくなります。

ここで、MSE の問題について説明します。プレーヤーが再生を続行するのに十分なデータを持っていない場合、Chrome で発生しているように見えるのは、1 ~ 2 秒間一時停止してから非常に高速に再生し、その逆も同様です。そのため、この時点でユーザー エクスペリエンスは非常に悪くなります。この問題はここで議論されました: https://www.w3.org/Bugs/Public/show_bug.cgi?id=28379

これを回避するための私の考えは、状態を特定し (データがない)、再生レートを数秒間 0.9 に変更してバッファリングを許可してから、1.0 に戻すことです。問題は、状態を特定する方法が見つからなかったことです。問題が発生したときでも、メディア要素の readystate は常に「HAVE_ENOUGH_DATA」の値を持っているようです。

MSE API は、私が説明した状態を識別する方法を公開していますか?

0 投票する
1 に答える
1292 参照

html - FFMPEG: ウェブカメラから連続したビデオを作成する

FFMPEG は Web カメラから (たとえば 10 秒) 間隔で記録できますか? ウェブカメラ (私が開発中の p2p ライブ ストリーミング アプリに使用) からの連続した小さなビデオが必要なので、実際には複数のビデオがあることに気付かずに次々と再生できます。

明確なカットが得られるように、キー フレームなどで中断する必要があると思います。

途切れることなく複数のビデオを再生するために、私は Web MediaSource API を使用していますが、実際にはすでにかなりうまく機能しています。

Web カメラ ストリームを複数の可変ビデオ ファイルに分割するだけで済みます。

ありがとう!

0 投票する
1 に答える
1178 参照

html - 断片化されていない mp4 ファイルを使用したメディア ソース拡張子

メディア ソース拡張子を使用して mp4 ファイルを再生しようとしています。私がフォローしている例は次のとおりです: http://html5-demos.appspot.com/static/media-source.html

この例は、webm ビデオと断片化された mp4 ビデオの両方で動作します。メディア ソースの拡張子は、フラグメント化されていない mp4 ビデオでは機能しませんか? ビデオのチャンクをソース バッファに手動で追加することはできませんか? 追加は機能しているように見えますが、ビデオは再生されません。

0 投票する
0 に答える
1295 参照

javascript - MSE (Media Source Extensions) を介してビデオを再生できない

MSE (Media Source Extensions) を使用してビデオを再生しようとしています。Ajax 応答でチャンクを取得し、sourceBuffer に追加することもできますが、再生中は再生されません。ここに私が書いたサンプルコードがあります...

0 投票する
2 に答える
1991 参照

html - HTML5 MediaSource を使用して、任意のサイズと長さの単色ビデオを動的に生成できますか?

ユーザーが幅、高さ、色、および期間を選択できるページがあるとします。次に、そのページの <video> タグで再生される、その色の静的フレームにすぎないサイズと期間のビデオをページに生成させたいと考えています。HTML5 MediaSource API を使用してこれを行うことはできますか?

例: ユーザーが 704x396 + rgb(0, 0, 0) + 00:00:15 を選択した場合、サイズが 704x396、長さ 15 秒、完全に黒のビデオを再生する <video> タグを生成します。Aegisub のダミー ビデオ機能に精通している場合は、基本的にそれを模倣しようとしています。

私が知る限り、MediaSource では、ブラウザがサポートする実際のビデオ コーデックで未加工のビデオ バイトをフィードすることしかできません。個々のフレームにフィードできるような「高レベル」の API はありません。

MediaSource でない場合、これを行う他の方法はありますか (もちろん、JS にコンパイルされた webm/MP4 エンコーダーをバンドルする以外に) ?