---
title: "YouTube埋め込みが表示されないときの原因と直し方"
description: "YouTubeのiframeをHTMLに埋め込んだが閲覧者に動画が表示されない問題で困っている方向け。動画の公開設定・埋め込み許可・ブラウザのCSP・ネットワーク制限など原因別の確認方法と修正手順を解説します。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/youtube-embed-hidden-fix"
markdown: "https://giga-site.com/articles/youtube-embed-hidden-fix/index.md"
category: "トラブルシュート"
publishedAt: "2026-06-25"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# YouTube埋め込みが表示されないときの原因と直し方

YouTubeの動画をHTMLに埋め込んでURLを共有したのに、相手のブラウザで動画プレーヤーが出ない、または真っ黒な状態になるトラブルは思いのほか多く発生します。原因は動画の公開設定・埋め込み許可設定・Content Security Policyなど複数にまたがるため、順序立てて確認することが重要です。

> Source HTML: https://giga-site.com/articles/youtube-embed-hidden-fix
> Article index: https://giga-site.com/articles/index.md

## よくある原因

動画のYouTube側の設定で「埋め込みを許可」がオフになっているケースが最多です。動画の所有者がYouTube Studio→コンテンツ→編集→その他の設定→埋め込みの許可を「はい」にしていないと、他ドメインのiframeで再生ボタンが出てもクリックしても動きません。自分がアップした動画なら設定画面で確認・変更できます。

「限定公開」動画を埋め込んだ場合、動画のURLを知っている人は見られますが、iframeで埋め込むと閲覧者のログイン状態やCookie次第で弾かれることがあります。限定公開動画を埋め込みで使いたいなら、閲覧者がGoogleアカウントにログインしYouTubeで動画URLに一度アクセスする必要があります。確実に見せたいなら「公開」設定を推奨します。

- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく

## 自分側で確認すること

iframeのsrc URLが`https://www.youtube.com/embed/動画ID`の形式になっているか確認します。通常の視聴URL（watch?v=...）をそのままsrcに使うと埋め込みが機能しません。YouTubeの「共有」→「埋め込む」から取得したiframeコードを使うのが確実で、動画IDを変えるだけなら`https://www.youtube.com/embed/VIDEOID`に直接書き換えても動きます。

HTMLを公開しているサーバーにContent Security Policy（CSP）ヘッダーが設定されている場合、`frame-src`や`child-src`にyoutube.comが含まれていないとブラウザがiframeを読み込みをブロックします。開発者ツールのコンソールに`Refused to frame`というエラーが出ていればCSPが原因です。サーバー設定でframe-srcにhttps://www.youtube.comを追加します。

- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する

## 相手側で確認すること

相手のブラウザでコンソールを開いてもらい、エラーメッセージを確認してもらいます。コンソールの開き方は「F12キーを押してConsoleタブを選択」と伝えるとわかりやすいです。「ERR_BLOCKED_BY_CLIENT」が出ていれば広告ブロッカー、「net::ERR_CONNECTION_REFUSED」ならネットワーク系の問題です。

会社や学校のネットワークではYouTubeへのアクセス自体が制限されている場合があります。このときiframe内に「動画を再生できません」と表示されるか、完全に空白になります。スマートフォンのモバイル回線に切り替えて確認し、見えれば社内ネットワーク制限が原因と断定できます。

- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する

## 再発防止の運用

YouTube動画をHTMLに埋め込む前の確認手順として「①動画がYouTube上で公開設定になっているか、②YouTube Studioで埋め込み許可がオンになっているか、③iframeのsrcが/embed/形式になっているか」の3点を毎回チェックする習慣をつけます。

共有先が社内メンバーのみでネットワーク制限がある場合、YouTubeへのリンクをiframeで埋め込むより、動画をダウンロードして別サービスでホスティングするか、video要素で直接ファイルを参照する方法が安定します。どうしてもYouTubeを使いたい場合は「YouTubeで直接開く」リンクを併記しておく回避策も有効です。

- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する

## よくある質問

### 動画はYouTubeで普通に再生できるのに、埋め込みだと表示されません。

YouTube Studioで動画の「埋め込みを許可する」設定がオフになっている可能性があります。動画の編集画面→その他の設定→埋め込みの許可を「はい」に変更してから再度確認してください。著作権管理コンテンツは埋め込みを強制的に無効にされることもあります。

### iframeが真っ黒で再生ボタンも表示されません。

iframeのsrc URLに`autoplay=1`と`mute=0`を同時に指定しているとブラウザポリシーでブロックされることがあります。自動再生する場合は`autoplay=1&mute=1`（音声ミュート）にする必要があります。また短い動画IDのタイプミスも真っ黒の原因になります。

### プライベート動画を限定的なメンバーだけに見せるにはどうすればよいですか？

YouTubeの「限定公開」設定では動画URLを知っている人だけがアクセスできますが、iframeでの安定表示は保証されません。確実に限定公開するならギガサイト便のようなパスワード付き・メール認証付きのプレビューURL機能を使い、動画は外部リンクとして別ウィンドウで開く構成が安全です。

## 関連記事

- [YouTube埋め込みが表示されないときに共有前に確認するチェックリスト](https://giga-site.com/articles/youtube-embed-hidden-checklist/index.md)
- [YouTube埋め込みが表示されない問題をAI生成HTMLで防ぐプロンプト](https://giga-site.com/articles/youtube-embed-hidden-ai-prompt/index.md)
- [YouTube埋め込みが表示されないときに相手へ伝える確認依頼の書き方](https://giga-site.com/articles/youtube-embed-hidden-request-message/index.md)
- [PDF埋め込みが表示されないときの原因と直し方](https://giga-site.com/articles/pdf-embed-hidden-fix/index.md)
- [Googleマップ埋め込みが表示されないときの原因と直し方](https://giga-site.com/articles/google-map-embed-hidden-fix/index.md)
- [PDF埋め込みが表示されないときに共有前に確認するチェックリスト](https://giga-site.com/articles/pdf-embed-hidden-checklist/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "YouTube埋め込みが表示されないときの原因と直し方",
  "description": "YouTubeのiframeをHTMLに埋め込んだが閲覧者に動画が表示されない問題で困っている方向け。動画の公開設定・埋め込み許可・ブラウザのCSP・ネットワーク制限など原因別の確認方法と修正手順を解説します。",
  "datePublished": "2026-06-25",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/youtube-embed-hidden-fix",
  "url": "https://giga-site.com/articles/youtube-embed-hidden-fix",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "トラブルシュート",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "動画はYouTubeで普通に再生できるのに、埋め込みだと表示されません。",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "YouTube Studioで動画の「埋め込みを許可する」設定がオフになっている可能性があります。動画の編集画面→その他の設定→埋め込みの許可を「はい」に変更してから再度確認してください。著作権管理コンテンツは埋め込みを強制的に無効にされることもあります。"
      }
    },
    {
      "@type": "Question",
      "name": "iframeが真っ黒で再生ボタンも表示されません。",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "iframeのsrc URLに`autoplay=1`と`mute=0`を同時に指定しているとブラウザポリシーでブロックされることがあります。自動再生する場合は`autoplay=1&mute=1`（音声ミュート）にする必要があります。また短い動画IDのタイプミスも真っ黒の原因になります。"
      }
    },
    {
      "@type": "Question",
      "name": "プライベート動画を限定的なメンバーだけに見せるにはどうすればよいですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "YouTubeの「限定公開」設定では動画URLを知っている人だけがアクセスできますが、iframeでの安定表示は保証されません。確実に限定公開するならギガサイト便のようなパスワード付き・メール認証付きのプレビューURL機能を使い、動画は外部リンクとして別ウィンドウで開く構成が安全です。"
      }
    }
  ]
}
```