2016-04-13 14 views
0

iframeにYouTubeを組み込もうとしましたが、空白に見えます。これは私がチェックしているコードですiframeのyoutubeが動作していません

<!DOCTYPE html> 
<html> 
<body> 

<iframe src="http://www.youtube.com"> 
<p>Your browser does not support iframes.</p> 
</iframe> 

</body> 
</html> 

これはなぜ起こっているのですか?それを機能させるために私は何をすべきですか?

答えて

1

consoleを確認してください。

「X-Frame-Options」が「SAMEORIGIN」に設定されているため、フレームに「https://www.youtube.com/」と表示されないことがあります。

読むより約X-Frame-Options here

X-フレーム・オプション応答ヘッダ

X-フレーム・オプションHTTPレスポンスヘッダは、ブラウザが必要があるかどうかを示すために使用することができます<frame>、または<object>のページをレンダリングすることが許可されている。サイトはこれを使用して、コンテンツが他のサイトに埋め込まれていないことを確認して、クリックジャック攻撃を回避します。

[...]

SAMEORIGIN

ページは、ページ自体と同じ起源にフレーム内に表示することができます。

[...]つまり

[...]あなたがSAMEORIGINを指定した場合、あなたはまだ限りのフレームで、それを含むサイトが同じであるように、フレーム内のページを使用することができます1つはページを提供する。

かいつまん:YouTubeのは、あなたが自分のサイトを埋め込みたいしません(注:!私はここにウェブページについて話して、ないビデオの)と明示的にブラウザにそれを伝えるためにHTTPヘッダーを設定します。

ビデオを表示/埋め込みたい場合は、共有»埋め込みのすべてのビデオの下にコードを使用してください。

<iframe width="1280" height="720" 
     src="https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0&amp;showinfo=0" 
     frameborder="0" allowfullscreen> 
</iframe> 
+0

私はこれを試してみましたが、それはちょうどそのビデオを示すことになります。提案された動画と共にページ全体を表示できる方法はありますか?私はiframe以外に行くことができる他の方法はありますか? –

+0

'*推奨ビデオと一緒にページ全体を表示できる方法はありますか?':可能であれば(ページをプロキシするような方法はありますが):おそらく[YouTubeのTOS](https: /youTube.com/static?template=terms)。あなたの最善の賭けは[YouTube API](https://developers.google.com/youtube/)を使用することですが、私はあなたの訪問者*のビデオを取得することは不可能(または非常に難しい)であると確信しています。私が間違っていると誰かが私を修正します。 – RobIII

0

あなたは、このいずれかを試すことができます:

<!DOCTYPE html> 
<html> 
<body> 

<iframe allowfullscreen="true" src="http://www.youtube.com/embed/c0MZ2bTtBm0?autoplay=1&amp;autoplay=1" style="width: 100%; height: 100%; opacity: 1; display: block;" class="ms-slide-video"></iframe> 

</body> 
</html> 
関連する問題