このコードはしばらくの間機能しますが、リンクが変更されていると思います。次の日には見つからないのですか?
Firefox/Chrome/Opera で再生される動画...この動画を永続的に再生する動画タグを作成するには?!
<video width="480" height="270" controls="controls" style="color:green;">
<source src="youtubelink" type="video/mp4">
<source src="youtubelink" type="video/ogg">
<source src="youtubelink" type="video/webm">
Your browser does not support the video tag.
</video>
実際のビデオ タグ内で YouTube ビデオを実際に再生する確実な方法はありません。YouTube はそれを望んでおらず、おそらく TOS に違反しています。いずれにせよ、YT がインフラストラクチャを調整するか、人々がビデオ ファイルに直接アクセスするのを阻止するために尽力するかにかかわらず、その URL はおそらく定期的に変更されるでしょう。
ただし、video タグを使用していた場合に実行できるほぼすべての操作を行うには、いくつかの手順を実行する必要があります。まず、「html5=1」ヒントを埋め込みに追加します。これにより、YouTube は Flash の代わりに html5 ビデオを使用するようになります (通常は準拠していますが、常に準拠しているわけではありません)。ビデオは iframe になりますが、通常のすべての CSS トリック (不透明度、変換など) をその iframe に適用できます。
YouTube API を使用している場合はhtml5: 1、playerVars. 単純な iframe 埋め込みを行う場合は、次のようにクエリ文字列に追加します:
http://www.youtube.com/embed/okqEVeNqBhc?html5=1
さらに一歩先へ進みたい場合、Popcorn.js には、YouTube (Vimeo 用にもあります) ビデオを HTMLVideoElement のように動作させる YouTube API 用の気の利いたラッパー オブジェクトがあり、ほとんど同じプロパティで、メソッドとイベント。完璧ではありませんが、かなり良いです。
注: そのファイルの公式ソースはmozilla/popcorn-jsリポジトリにありますが、これは現在、バグ修正と機能が先行しています。最新バージョンの Popcorn.js とそのリポジトリーを含める必要がありますwrappers/common/popcorn._MediaElementProto.js。&html5=1を設定するときは、必ず YT URL に追加してくださいsrc。
違いは次のとおりです。
ラッパーを使用しても、HTML5 ビデオ API のパフォーマンスは YT API よりもわずかに優れています。たとえば、バッファリングの応答性が向上し、レポートが改善されます。
一時停止またはマウスオーバーで表示される右下隅の YouTube アイコンを取り除くことはできません。
YouTube に広告が表示されないようにすることはできません。
Audio API や canvas/webgl 描画などの実際のビデオ/オーディオ コンテンツにアクセスすることはできません。しかし、クロスオリジンの制限のため、とにかくそれを行うことはできませんでした.