youtube html 埋め込み

Question

cakephp でアプリケーションを作成していてyoutubeの動画をhtmlに埋め込みたいのですが、うまくできません。

実際のyoutubeのurlをこのように書くとうまく行きます。

<iframe src="https://www.youtube.com/embed/IuONgcei1vI" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

今私が作成しているアプリケーションでは
$sampleという変数のmovie_urlというカラムにyoutubeのurlを保存しています。

<iframe src="<?= h($sample['movie_url']) ?>" frameborder="0" allowfullscreen></iframe>

この場合だと
www.youtube.com で接続が拒否されました。
と表示されます。

chromeの検証だと
Refused to display 'https://www.youtube.com/watch?...&feature=youtu.be' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
とエラーが出ています。

Comments

[yukikp]

> $sampleという変数のmovie_urlというカラムにyoutubeのurlを保存しています。
という事なのに、この変数やらカラム名が全くコードに出てきてないのは何か意味があるのでしょうか？

[退会済みユーザー]

すいません、修正しました。

[yukikp]

それと、URLに「embed」が入っていないと、それは埋め込み用のURLではないので拒否られますよ。

Answer 1

URLが埋め込み用の物を使っていないからではないでしょうか？

html - embed youtube video - Refused to display in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN' - Stack Overflow

You must ensure the URL contains embed rather watch as the /embed endpoint allows outside requests, whereas the /watch endpoint does not.

追記：
例えばyoutubeの動画ページのURLが
https://www.youtube.com/watch?v=hogehoge
だとしたら、埋め込み用iframeで使用されるURLは、
https://www.youtube.com/embed/hogehoge
の様です。

Comments

[退会済みユーザー]

ありがとうございます！
embedをいれたところ表示はできました。
しかし再生ボタンを押すとエラーが発生しました。しばらくしてからもう一度お試しください。
とエラーがでてしまいました...

[m.ts10806]

埋め込みURLそのまま貼り付けるのが確実ですね。
https://support.google.com/youtube/answer/171780?hl=ja

[yukikp]

> embedをいれたところ表示はできました。

そういう意図ではなくて、埋め込み用のURLあるいは埋め込み用のiframeを使ってくださいと言う意味です。

Answer 2

ブラウザの「ソースを表示」して実際に埋め込まれたmovie_pathを確認してください。
HTMLのエスケープ（h()はエイリアスですかね→CakePHPの提供ですね。失礼）により、例えば&→&などの変換が入っている可能性があります。