YouTube 埋め込み動画が「エラー153」で再生できない— 原因と対処（2025年末の Referer ポリシー強化）

ブラウザゲーム「Snoot」の開発備忘録に、原作 Snood の参考プレイ動画を YouTube 埋め込みで追加した。ところがローカルで確認すると、プレーヤーが黒画面のまま 「エラー153：動画プレーヤーの設定エラー」 と表示されて再生できない。本番（GitHub Pages）では問題なく再生されるのに——。この食い違いの正体と対処をまとめる。

何が起きたか
エラー153 とは
なぜローカル（file://）で出たのか
なぜ本番（GitHub Pages / https）では再生されるのか
正しい埋め込み方（対処）
確認のしかた
まとめ
参考リンク

何が起きたか

備忘録ページに、標準的な YouTube の埋め込み（iframe）を置いた。保存した HTML をダブルクリックしてブラウザで開いたところ、動画の領域が黒くなり、中央に次のエラーが出た。

図：ローカルで開いたときに出た「エラー153：動画プレーヤーの設定エラー」。「YouTube で動画を見る」リンクだけが表示され、その場では再生できない。

コード自体に打ち間違いは無く、同じページを 本番サーバー（https）に上げると正常に再生される。つまり「コードの誤り」ではなく「開き方（環境）」の問題だった。

エラー153 とは

エラー153 は YouTube プレーヤーが返す「動画プレーヤーの設定エラー」。デバッグ情報には embedder.identity.missing.referrer と出る。これがすべてを物語っている。

2025年末から、YouTube は「埋め込み元サイトを HTTP Referer ヘッダで識別できないと再生を拒否する」 ようになった。埋め込みプレーヤーは、どのサイトに貼られているかを Referer で確認する。Referer が送られてこない（または剥がされている）と、「埋め込み元の身元が不明（identity missing referrer）」と判断してエラー153 を返す。

なぜローカル（file://）で出たのか

原因はシンプルで、HTML ファイルを file:// で直接開いていた から。

file:// のページは オリジンが null で、外部サイトへ Referer を送れない。
そのため、埋め込みの書き方が正しくても YouTube に身元を示せず、必ずエラー153 になる。

つまり、ローカルで file:// 開きしたときの153 は 環境要因であって、ページの不具合ではない。ローカル確認はファイルのダブルクリックではなく、後述の https な URL（またはローカルの HTTP サーバー）で行うのが正しい。

なぜ本番（GitHub Pages / https）では再生されるのか

本番は https://〜.github.io/ という正式なオリジンから配信される。だからブラウザは Referer: https://〜.github.io/ を YouTube に送れる。YouTube は身元を確認でき、再生が通る。

さらに今回は念のため本番のレスポンスヘッダも確認した。GitHub Pages は Referrer-Policy や Content-Security-Policy といった「Referer を消す/制限するヘッダ」を返していない。だから Referer が落ちることもなく、安定して再生される。

環境	Referer	結果
`file://`（ダブルクリック）	送れない（オリジンが null）	エラー153
https（GitHub Pages 等）	送れる（https のオリジン）	正常に再生

正しい埋め込み方（対処）

サイト（https）に置く前提で、Referer 強化に強い書き方は次のとおり。

<iframe
  src="https://www.youtube-nocookie.com/embed/VIDEO_ID"
  title="動画タイトル"
  loading="lazy"
  referrerpolicy="strict-origin-when-cross-origin"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  allowfullscreen></iframe>

referrerpolicy="strict-origin-when-cross-origin" を付ける — 外部（YouTube）にもオリジン（スキーム＋ホスト）を Referer として送る。これが肝。
src を youtube-nocookie.com/embed/… に — プライバシー強化ドメイン。153 対策として広く推奨されている。
サイト側で Referer を消すヘッダを設定しない — 例えばサーバーが Referrer-Policy: same-origin や no-referrer を返すと、外部リンク（＝埋め込み）への Referer が剥がれて153 になる（Django の SecurityMiddleware 等が既定で付けるケースが知られている）。必要なら strict-origin-when-cross-origin に変更する。

補足：閲覧者側の広告ブロッカー・プライバシー拡張・ブラウザ設定が Referer を消すと、正しく作ったサイトでも利用者の環境だけ153 になることがある。その場合はキャッシュ削除や拡張の無効化で改善する。

確認のしかた

file:// ではなく https の URL で開く（本番、または npx vite preview 等のローカル HTTP サーバー経由）。
本番のレスポンスヘッダに、制限的な Referrer-Policy / Content-Security-Policy が付いていないか確認する。