よくある原因
AIは「YouTubeの動画を埋め込んで」という指示に対し、`https://www.youtube.com/watch?v=XXXX`というwatch URLをそのままiframe srcに入れたコードを生成することがあります。このURLは埋め込み非対応のため、ブラウザがiframeを表示しても再生コントロールが正常に機能しません。プロンプトで「embed形式のURLを使うこと」と明示する必要があります。
AIが動画IDとして架空の文字列(例:`SAMPLE_VIDEO_ID`)をプレースホルダーに使ってコードを出力するケースもあります。ユーザーがそのまま使うと無効な動画を参照してエラーになります。プロンプトに実際の動画URLを貼り付け「このURLの動画を埋め込んでください」と渡す方法が最も確実です。
- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく
自分側で確認すること
AIが出力したHTMLのiframe srcが`https://www.youtube.com/embed/XXXX`形式になっているか確認します。動画ID部分(11文字の英数字)が実際の動画と一致しているかはYouTubeで動画を開いてアドレスバーの`v=`以降の文字列と照合します。1文字でも違うと別の動画または404になります。
AIにautoplay(自動再生)を含めるよう指示した場合、モダンブラウザは音声付きの自動再生をポリシーでブロックします。自動再生させるには`autoplay=1&mute=1`(音声ミュート)を組み合わせる必要があります。AIがautoplay=1だけを設定したコードを出した場合は手動でmute=1を追加してください。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
相手側で確認すること
AIが生成したHTMLを相手に共有して「動画が見えない」と連絡が来た場合、まず相手に「動画の場所に何が表示されているか」を確認します。「グレーのボックスに×アイコン」であればsrc URLが無効、「再生ボタンはあるがクリックしても動かない」ならautoplay関連の問題、「iframeが見えない」ならCSSの問題です。
相手がモバイル環境でHTMLを開いている場合、iframeの横幅が画面幅に固定値(px)で設定されていると、画面からはみ出して再生できない状態になることがあります。AIへのプロンプトに「レスポンシブ対応でwidth:100%・aspect-ratio:16/9にしてください」と追加すると、この問題を最初から防げます。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
再発防止の運用
YouTube埋め込みHTMLをAIに生成させるときのプロンプトテンプレートを用意します。例:「次のYouTube URLの動画を埋め込んだHTMLを作成してください。[URL] iframeのsrcはhttps://www.youtube.com/embed/VIDEOID形式にし、widthは100%・aspect-ratio:16/9でレスポンシブ対応にしてください。autoplayは使わないでください」。このテンプレートを使うことで一般的な失敗パターンをほぼ回避できます。
AIが生成したHTMLをシークレットウィンドウでプレビューし、動画が再生できることを確認してから共有するルールを設けます。AIの出力は正しそうに見えても動作確認が必須です。ギガサイト便などプレビューURLで確認できるサービスを活用すると、確認→共有の一連の流れをスムーズに完結できます。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
よくある質問
AIに「この動画を埋め込んで」と動画URLを渡したのに違う動画IDが生成されました。
AIがURLを正確に解釈せず内部で別の動画IDを生成することがあります。出力されたHTMLのiframe srcの動画IDと、元のYouTube URLのv=以降の11文字が一致しているか必ず目視確認し、違う場合は手動で書き換えてください。
AIに音声なし自動再生の動画を作ってもらいましたが、iPhoneで動きません。
iOSのSafariは`muted`属性と`playsinline`属性が両方ないとautoplayを拒否します。iframeではなくvideo要素を使う場合は両属性を必ず追加してください。YouTubeのiframeの場合は`autoplay=1&mute=1&playsinline=1`をURLパラメータに加えます。
プロンプトを工夫しても毎回動かないコードが生成されます。どうすればよいですか?
AIへの依存をなくす方法として、YouTubeの「共有」→「埋め込む」から取得したiframeコードをそのまま使い、AIにはそのコードをHTML内の指定箇所に入れてもらうだけにする分担が有効です。コア部分は人間が用意することで品質が安定します。