1

サーバーに長い.m4vビデオファイル（約1時間）がありますが、自分のサイト（HTML-5）に、そのサブセクションのみを表示するビデオ（たとえば、分3-> 5、続いて分）を表示したい19-> 20）。したがって、ユーザーに表示されるビデオの長さはわずか5分です。

このユースケースをサポートする現在のHTML-5ビデオプレーヤーや巧妙なトリックを知っている人はいますか？私が欲しい機能はQuickTimeリファレンスファイルのようなものだと思いますが、HTML5 -videoでは、ユーザーがビデオを再生すると、「サブセクション」のみが表示され、その間に何も表示されません。

助けていただければ幸いです。

4

2 に答える 2

2

Media Fragments URIを使用して、サーバーにビデオファイルの一部のみを要求するようにブラウザに指示できます。

たとえば、このビデオを10秒から20秒で取得するには、次のようなURLを使用してビデオソースを設定します。

<video src="myvideo.webm#t=10,20"></video>

いつものように、これはInternetExplorerでは機能しません。

それでも、複数のビデオフラグメントを順番につなぎ合わせる必要があります。それぞれに「終了」イベントリスナーを配置して次のビデオをキューに入れるか、 popcorn.sequenceのようなライブラリを使用できます。

于 2012-09-15T07:39:49.910 に答える
0

私はbrianchirlsに同意します。メディアフラグメントはうまく機能し、コードは非常に少ないです！

もう1つのオプションは、HTML5ビデオタグにすばらしい組み込みリスナーを使用することです。

次のようなことができます。

video = document.getElementByTagName('video')[0];
insAndOuts = [{in: 3, out: 5}, {in: 19, out: 20}];

video.addEventListener('loadeddata', function(){
  video.currentTime = insAndOuts[0].in;
});

var nextTime = function(time){
  var ends = _.map(insAndOuts, function(x){ return x.out});
  return ends.indexOf(time) + 1;
};

video.addEventListener('timeupdate', function(){
  var nextIndex = nextTime(video.currentTime)
  if(nextIndex > 0) {
    video.currentTime = insAndOuts[nextIndex].in;
  }
});

私の記憶の限りでは、これは基本的に、brianchirlsの投稿からのポップコーンシーケンスのものです。これはすべてのブラウザで機能しますが、管理するコードがたくさんあります。

于 2015-03-11T10:16:20.693 に答える