web-dev-qa-db-ja.com

YouTubeビデオがiframeに表示されない

HTMLに入力したコードは次のとおりです

<iframe width="640" height="360" src="https://www.youtube.com/watch?v=ZwKhufmMxko">
</iframe>

ビデオフレームは表示されますが、実際のビデオは読み込まれず、表示されません。私は待ってみましたので、ロードの問題ではないはずです。

また、現在はHTMLとCSSのみを使用しています

これを機能させる方法についてのアイデアはありますか？

htmlcssiframeyoutube
11
jdavid

YouTubeは、サードパーティがそのように直接サイトを埋め込むことを許可していません。を使用して

<iframe width="640" height="360" src="https://www.youtube.com/watch?v=ZwKhufmMxko">
</iframe>

エラーが発生しますRefused to display 'https://www.youtube.com/watch?v=ZwKhufmMxko' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.これを示すために（実際にこれらのことをコンソールで確認する必要があります）。

幸い、Youtubeには「ビデオを埋め込む」オプションがあり、ビデオを埋め込むために使用する必要があります。

たとえば、リンクされたビデオはiframeコードを生成します。

<iframe width="560" height="315" src="https://www.youtube.com/embed/ZwKhufmMxko" frameborder="0" allowfullscreen></iframe>
18
apokryfos

「watch？v =」を「embed /」に変更します

正しいリンクを取得する最も簡単な方法は、YouTubeビデオを右クリックして、「埋め込みコードのコピー」を選択することです。

<iframe width="854" height="480" src="https://www.youtube.com/embed/ZwKhufmMxko" frameborder="0" allowfullscreen></iframe>
12
user3467534