0

ビデオを Web ページに埋め込む作業を行っており、mediaelements.js を使用しています。mediaelements.jsの例から次のコードを使用しました。

<video width="640" height="360" id="player2" poster="img/echo-hereweare.jpg" controls="controls" preload="none">
    <source type="video/mp4" src="somevideo.mp4" />
    <source type="video/webm" src="somevideo.webm" />
    <source type="video/ogg" src="somevideo.ogv" />
    <object width="640" height="360" type="application/x-shockwave-flash" data="flash/flashmediaelement.swf">       
        <param name="movie" value="flash/flashmediaelement.swf" /> 
        <param name="flashvars" value="controls=true&amp;file=somevideo.mp4" />
        <img src="img/echo-hereweare.jpg" width="640" height="360" alt="Here we are" 
        title="No video playback capabilities" />
    </object>
</video>

その後、例のスクリプト コードが続きます。

<script>
    $('audio,video').mediaelementplayer({
        success: function(player, node) {
            $('#' + node.id + '-mode').html('mode: ' + player.pluginType);
        }
    });
</script>

その後、Firefox で奇妙なことを発見しました。mediaelements.js を起動せずに(上記のスクリプトを使用せずに) このコードを使用すると、firefox は .mp4 を再生しようとしますが、当然、コンソールには .mp4 形式がサポートされていないというエラーが報告されます。これまでのところ、そうです。

私の理解では、ビデオ要素は次の形式である .webm を試す必要があります。代わりに、フラッシュ フォールバックがロードされます (flashmediaelement.swf) (再生ボタンはまだクリックされていないため、これまでのところ何も再生されませんが、.swf は完全にロードされています)。

次に、ビデオを再生すると、予想どおり、.webm がダウンロードされて再生されます。

mediaelements.js で使用すると、さらに奇妙なことが起こります。.swf は 1 回完全に読み込まれるだけでなく、ダウンロードされることなく、少なくとももう一度要求されます (firebug のネットワーク タブに表示されます。あたかもロードしてロードするかのようにビジーなスピナー. しかし、エラーやステータスコードはなく、ファイルサイズも表示されていません. 「スタック」したリクエストのようです. スクリーンショットを投稿したいのですが.現在は許可されていません。）

さらに、Firebug のコンソールに、.webm をデコードできないというアラートが表示されます。.webm-video の読み込みが開始されますが、完全には読み込まれません (状態コード 206)。.webm を再生しようとしましたが、デコード エラーのために停止したため、ビデオはまったく再生されません。その場合、フラッシュのフォールバックが飛び込むべきではありませんか?

私の質問は今：

  1. これは、メディア要素に対する Firefox の通常の動作ですか? フォールバック FlashPlayer が必要でなくても読み込まれますか?
  2. どちらも使用されていないのに、2 番目のシナリオで 2 回または 3 回ロードされるのはなぜですか? これは mediaelemnts.js のバグだと思います
  3. そして 3 番目に、なぜ firefox は mediaelements.js なしで .webm を再生し、mediaelements.js を使用しないのですか? 別のバグだと思いますか？

助けてくれてありがとう。

---注--- mediaelements.js を使用していない場合でも、mediaelements.js に付属の .swf をフォールバック ソリューションとして使用していることはわかっています。シンプルで軽量なフラッシュ ビデオ プレーヤーを知っている人はいますか? それとも、標準の Flash ビデオ プレーヤーとして flowplayer を使い続ける必要がありますか?

4

1 に答える 1

0

すべてのビデオ ファイルの複数のバージョンを持つことはできません (多くのサイトがあり、サイト全体がダウンロードされます)。これを書いたところ、現在の Safari、FireFox、および Chrome で動作するようです。他のすべてで動作するか、非 MP4 に追加する必要があります。リスト

<script type="text/javascript">
    /*U might need to add other non-MP4 native browsers*/
    if (navigator.userAgent.indexOf('Firefox'||'Chrome') != -1) {
        document.write("<object type='application/x-shockwave-flash' data='player.swf' width='480' height='270'>
        <param name='movie' value='player.swf' />
        <param name='allowFullScreen' value='true'/>
        <param name='wmode' value='transparent' />
        <param name='flashVars' value='controlbar=over&amp;file=video/sequence03.mp4' />
        <span title='No video playback capabilities, please download the video below'>
        <a href='video/sequence03.mp4'>Sequence 03</a></span></object>")
    }
    else {
        document.write("<video width='480' height='270' controls><source src='video/sequence03.mp4' type='video/mp4' /></video>")
    }
</script>
于 2012-10-08T05:12:53.527 に答える