Beyond‘s blog

IT/Webの技術

【中国サーバー】YouTube のサムネイル画像が表示されない

中国のサーバー環境で WordPress を運用する場合、YouTube の動画URLを記事に貼り付けただけでは、サムネイル画像が自動的に表示されないことが大半です。

通常の WordPress 環境では、YouTube をはじめとする主要な動画プラットフォームのURLを貼り付けるだけで、oEmbed 機能が働き、サムネイル付きの埋め込みプレーヤーが自動生成されます。

しかし、中国サーバーではこの自動埋め込みが正常に動作しないケースが多く見受けられます。

これは中国独自のネットワーク規制や技術的制約によるもので、動画コンテンツを扱う際には特別な対応が必要です。

本記事では、WordPress での動画埋め込み方法と、中国サーバー特有の制約、そしてその回避策について解説いたします。

WordPress で動画を埋め込む、2つの方法

WordPress 環境の記事ページに動画を挿入する方法は、大きく分けて、以下の2つがあります。

項目 メリット デメリット
① ローカルサーバーに直接アップロード ○ 外部サービスに依存しない
○ 完全にコントロール可能
○ 非公開や限定公開など、アクセス制限のあるサイトに適する
○ サーバー容量、帯域を消費
○ サイト表示速度が低下する可能性
② 外部プラットフォーム(YouTube など)のURLを埋め込み ○ サーバーリソースを節約
○ スムーズな再生が期待できる
○ SNSでの拡散効果
○ 外部サービスに依存
○ 中国サーバー環境では動作しない場合が多い

参考:WordPress で自動埋め込みに対応している、主なプラットフォーム

WordPress(Gutenberg エディタ基準)が自動埋め込みをサポートしている、主なプラットフォームは以下の通りです。

これらのプラットフォームは、通常の環境(中国サーバー以外)であれば、URLを貼り付けるだけで自動埋め込みが機能します。

※ ただし、中国サーバーでは、特に YouTube においてサムネイルが表示されないなど、本記事で解説する問題が発生します。

項目 主なプラットフォーム
中国サーバー以外の WordPress 環境
(Gutenberg エディタ基準)
Amazon、Animoto、Cloudup、CollegeHumor、Crowdsignal、Dailymotion、Facebook、Flickr、Hulu、Imgur、Instagram、Issuu、Kickstarter、Meetup.com、Mixcloud、Reddit、ReverbNation、Screencast、Scribd、Slideshare、SmugMug、Someecards、SoundCloud、Speaker Deck、Spotify、TED、Tumblr、VideoPress、Vimeo、WordPress.tv、X(旧:Twitter)、YouTube

中国サーバーでの注意点:YouTube の自動埋め込みが機能しない理由

< 中国サーバーではサムネイルが表示されない >

今回は、特に利用頻度の高い YouTube を例に、問題の詳細を解説します。

通常、WordPress はビジュアルエディタに YouTube のリンクを貼り付けると、内部的に oEmbed API を利用して、YouTube からメタ情報(サムネイル画像、動画タイトルなど)を取得します。

その結果、自動的に iframe 形式へ変換され、サムネイル付きのプレーヤーが記事内に表示されます。

しかし、中国サーバーでは、この一連の流れが機能せず、「サムネイルが表示されない」「動画が再生できない」といった、問題が発生します。

主な技術的要因

項目 概要
YouTube リソースへのアクセス遮断 サムネイル画像(例:https://img.youtube.com/vi/VIDEO_ID/hqdefault.jpg)や、oEmbed エンドポイント(https://www.youtube.com/oembed)へのアクセスが遮断される。

そのため、WordPress がメタデータを取得できずサムネイルを生成できない。

ファイアウォールによるリクエスト破棄 中国サーバーから YouTube のリクエスト(特にサムネイル画像取得)が途中で破棄される。

これにより、画像の代わりに、空のプレースホルダーだけが表示される。

WordPress の oEmbed キャッシュ問題 通常の WordPress 環境であれば、一度取得した oEmbed データをキャッシュする。

しかし、中国サーバーの場合、初回リクエストが失敗するためキャッシュが作成されず、以降もサムネイルが空のままになる。

技術的な回避策(暫定対応)

< 中国サーバーでは iframe コードを記述する >

これらの問題を回避するには、自動埋め込みに頼らず、手動で iframe コードを記述する方法があります。

具体的には、記事のテキストエディタ(またはカスタムHTMLブロック)に、以下のような iframe タグを直接記述します。

<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allowfullscreen></iframe>

※ ただし、この方法で埋め込んだ場合でも、動画の再生自体は中国国内からのアクセスではブロックされます。

まとめ

中国のサーバー環境で WordPress を運用する際、YouTube の自動埋め込み機能は事実上期待できません。

もしサムネイルを表示したい、あるいは埋め込みプレーヤーを表示したい場合には、iframe を手動で記述するなどの工夫が必要です。

動画コンテンツのサムネイルが表示されない状態が続くと、ユーザー体験を損ない、コンテンツの価値が正しく伝わらない可能性があります。

サーバーの設置場所とターゲットユーザーを考慮した動画配信方法(中国国内なら「bilibili」の活用など)を選択することを推奨します。

関連サービス

ホームページ制作 https://beyond-shenzhen.cn/service/website
クラウド構築 https://beyond-shenzhen.cn/service/server

 

ホームページ制作、クラウド構築のことなら

 

弊社へのお問い合わせについて

  • ▼ 企業WeChat公式アカウント▼

  • ▼ WeChatで担当者に直接連絡 ▼

お気軽にお問い合わせください

CONTACT

お気軽にお問い合わせください

WeChat 公式アカウント