HTML5 youtubeビデオを強制する


119

Youtube APIブログに関して、彼らは新しいHTML5ビデオプレーヤーを実験しています

どうやらhtml5でビデオを再生するには、iframe埋め込みコードを使用する必要があります。

<iframe class="youtube-player" type="text/html" width="640" height="385"
  src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0">
</iframe>

ただし、クライアントがHTML5トライアルに参加していない場合、クライアントのブラウザーがHTML5ビデオ対応であっても、プレーヤーは自動的にFlashプレーヤーにフォールバックします。

ユーザーがまだHTML5トライアルに参加していない場合でも、ブラウザーがHTML5ビデオの再生を強制する方法を教えてください。

それ以外の場合、フラッシュフォールバックを無効にする方法は?

編集:

YouTube動画へのリンクを介してHTMLプレーヤーを強制することは可能ですが、埋め込み動画にはこの種の機能が必要です。


jsでHTML5機能を検出し、それに応じてyoutube apiコードを実装するとしたらどうでしょう。あるいは、HTML5ビデオがサポートされていない場合は、YouTube APIを実装しないでください。Flashに頼るからです。
David

回答:


179

私は解決策を見つけました:

html5=1iframeのsrc属性にを追加する必要があります。

<iframe src="http://www.youtube.com/embed/dP15zlyra3c?html5=1"></iframe>

ビデオはHTML5として表示されます(利用可能な場合)、またはFlashプレーヤーにフォールバックします。


1
うーん-今は機能していません(同じvids)。特定のYouTubeサーバーでしか機能しないのでしょうか。
UpTheCreek

1
&html5=1埋め込まれていないビデオの最後に追加すると機能しません:/
Moshe Revah '26

1
ハイパーリンク(iframe埋め込みビデオではない)の末尾に&html5=1(または&html5=trueそのようなものを)追加しても、FlashなしのIEでは機能しないようです。
ライアン

1
広告付きのYouTubeビデオは自動的にFlashプレーヤーを使用します
2013年

8
私はすべての報告が偏っていると思います。「youtubeのhtml5ベータ版」にいるかどうかは誰も言っておらず、これがおそらく重要な要素です。html5ベータ版を終了すると、?html5 = 1は何も実行しないようです。すべてのビデオはフラッシュに対応しています。
Paul Brewczynski 2013

20

YouTube動画がHTML5形式で再生されるかどうかは、ブラウザごとのhttps://www.youtube.com/html5の設定によって異なります。Chromeは自動的にHTML5再生を優先しますが、最新のFirefoxやInternet Explorerでも、マシンにインストールされていればFlashを使用します。

パラメータhtml5 = 1は(もう)何もしません。(https://developers.google.com/youtube/player_parametersにもリストされていません)。


チェックしたところ、youtube.com /html5でHTML5プレーヤーを選択しましたが、埋め込みプレーヤーのパラメーターとして&html5 = 1が指定されていない場合、param HTML5プレーヤーが読み込まれるように指定すると、Flashが読み込まれます。OS:Linux、Firefox 33 64ビット。
Czar

html5=1Firefox 33.0.2でテストしたところ、問題なく動作しました(ユーザーがYouTubeでHTML5設定を有効にする必要はありません)。これがない場合、YouTubeはデフォルトでFlashバージョンを送信します。
Simon East

パラメータは引き続き機能しますが、html5ページで有効にすると、youtubeのデフォルトがhtml5になり、より優れています。
アラン

4

iframe埋め込みコードを使用してみましたが、HTML5プレーヤーが表示されましたが、何らかの理由でiframeがサイトを完全に破壊していました。

私は古いオブジェクト埋め込みコードをいじりました、そしてそれは完全にうまく働きます。したがって、iframeで問題が発生している場合は、次のコードを使用します。

<object width="640" height="360">
<param name="movie" value="http://www.youtube.com/embed/VIDEO_ID?html5=1&amp;rel=0&amp;hl=en_US&amp;version=3"/>
<param name="allowFullScreen" value="true"/>
<param name="allowscriptaccess" value="always"/>
<embed width="640" height="360" src="http://www.youtube.com/embed/VIDEO_ID?html5=1&amp;rel=0&amp;hl=en_US&amp;version=3" class="youtube-player" type="text/html" allowscriptaccess="always" allowfullscreen="true"/>
</object>

これが誰かに役立つことを願っています


YouTube <object>は1月末をもって廃止されます。<iframe>代わりに使用してください。
Samuel Elh

<object>まだ機能しますが、実際にはiframeに含まれているだけです。
RozzA

2

iframe埋め込みAPIを使用している場合は、次のように引数のhtml5:11つとしてplayerVars指定できます。

player = new YT.Player('player', {
    height: '390',
    width: '640',
    videoId: '<VIDEO ID>',
    playerVars: {
        html5: 1
    },
});

完全に動作します。


0

インラインタグは、ドキュメントの別のソースを現在のhtml要素に追加するために使用されます。

あなたの場合、YouTubeのビデオであり、リンクの外部でブラウザにhtmlタイプ(4または5)を指定する必要があります

リンクの最後に?html = 5を追加します。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.