 🔰リサーチャーまるお
🔰リサーチャーまるおせっかくブログにYouTube動画を埋め込んだのに、エラーになっているって言われたんすけど



iOSだと、どうやら見れなくて、パソコンやAndroidスマホでは現在は見れているようだよ、詳細解説するね
WordPressで記事にYouTubeを埋め込んだけど、スマホでみたら「エラー153」と表示される
この記事のハイライト
・YouTube の「エラー 153(Error 153: Video player configuration error)」とは、埋め込み(iframe形式など)や特定環境で動画再生しようとした際に「ビデオプレーヤーの構成に問題があります」という旨のエラーが出ること。
パソコン→問題なく再生できる
Androidスマートフォン(OPPO)→問題なく再生できる
iphone16→エラー153でサムネも表示されない、というように
・iphoneでエラー発生率が高い、Cookieが原因の可能性大。
・埋め込み方法を変えてみよう(コピペできるコードあり)
・サイトユーザーがパソコンやアンドロイドユーザーが多い場合はそのままで様子を見てもよい
WordPressのYouTube埋め込み「エラー153」はiOSで生じる


YouTube の「エラー 153(Error 153: Video player configuration error)」とは、埋め込み(iframe形式など)や特定環境で動画再生しようとした際に「ビデオプレーヤーの構成に問題があります」という旨のエラーが出ること。
エラー153が起こる原因は以下といわれています。
一般的な原因
ブラウザ拡張機能または広告ブロッカー:トラッカーや広告をブロックする拡張機能 (Blur、uBlock など) は、埋め込まれた YouTube 動画に干渉し、エラー 153 などのプレーヤー エラーを引き起こす可能性があります。
ブラウザの互換性または設定:古いブラウザや不適切な設定により、ビデオプレーヤーが正しく読み込まれない場合があります。ハードウェアアクセラレーションや特定のブラウザ機能も問題の原因となる場合があります。
ネットワークまたは接続の問題:インターネット接続が遅い、または不安定な場合、ビデオの再生が中断され、ビデオ プレーヤーの構成または起動でエラーが発生する可能性があります。
破損したキャッシュ データ:ブラウザ内の古いまたは破損したキャッシュや Cookie は、メディアの再生を妨げ、エラーを引き起こす可能性があります。
YouTube API または埋め込みの問題:プレーヤーの設定や API の使用法が正しくないなど、ビデオを Web サイトに埋め込む方法に問題がある場合、特に最初の読み込み時にエラー 153 が発生することがあります。
今回私の手元で確認してみたところ、
パソコン→問題なく再生できる
Androidスマートフォン(OPPO)→問題なく再生できる
iphone16→エラー153でサムネも表示されない
という状況、他の人に確認してもiphoneだとエラーになる状況でした。
ちなみに、集まる集客®︎総研はWordPressテーマ:SWELLを使用中。
解決策をリサーチしました。
SWELLでエラー153になるときは埋め込み方法を変更で解決できる
今回はiphoneのCookie(クッキー)が原因と考えられます。
そこで、YouTubeの埋め込み方法をちょっとだけ変えると
iphoneでも今まで通り埋め込まれたYouTubeを確認することができます。



🍪??クッキー🍪ってなんすか?



サイトが一時的にあなたの情報を覚えておくメモ、みたいなものだよ
CookieはYouTubeで「どの動画を途中まで見たか」
サイトにログイン中かどうか、
広告をどの人に見せたかなど覚えておく情報です。
Appleはプライバシー重視の方針で、
iPhoneのSafariでは
サードパーティCookie(外部サイトなどの情報)を全部ブロックしています。
その影響でChromeを使っていたとしても
エラーが起こる原因に。
そこで使うのが「視聴履歴などのCookieを使わず、ただ動画だけを再生するモード」
なので、Safariにもブロックされず、iPhoneでも正常に再生されます。
no cookieでYouTube埋め込みをしてみよう
【動画ID】はYouTubeの埋め込みたい動画のIDを入れてください
以下をコピーして「カスタムHTML」のブロックに入れましょう!
<div style="position:relative; padding-bottom:56.25%; height:0; overflow:hidden; max-width:100%;">
  <iframe src="https://www.youtube-nocookie.com/embed/【動画ID】"
  title="YouTube video player"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
  referrerpolicy="strict-origin-when-cross-origin"
  allowfullscreen
  style="position:absolute; top:0; left:0; width:100%; height:100%;">
  </iframe>
</div>また
TOPページ掲載の動画ならウィジェットの動画が使える可能性があります。


SWELLではアイキャッチ用動画に影響あり
テーマがSWELL、編集画面でサイドバーからアイキャッチ用動画として動画IDを入れていた場合、
そこではこのコードを入れられないので結局カスタムhtmlで動画を張り替えることになります。
もしかしたら、今後仕様が変更されて、表示されるようになる可能性もあるかもしれません。
が、現時点で即改善できる方法は今回の埋め込み方法を変えることでした。
対策しておきたい方は参考にしてください。
参考:https://ignite.video/en/articles/basics/youtube-no-cookie



