THINK.BUILD.LOG._

技術と好奇心の備忘録。

PHP, サーバー・インフラ

WordPressのOGP画像がXに出ない──メタタグは正常なのにカードが表示されない現象を調査

ちゃっぴーがWordPressのOGP画像とXカードの表示トラブルを調査するイラスト。アイキャッチが表示されない原因やメタタグを確認している。

WordPressの記事をX（旧Twitter）で共有したところ、記事タイトルとURLは表示されるのに、設定したOGP画像が出てこない。ところが、新しい投稿では同じサイトの画像付きカードが表示された。

今回は、この不思議な現象を実際の通信結果から調べた記録。確認できた事実と、まだ検証できていない推測を分けて整理しておく。

起きた現象

対象はWordPressで公開した「Windows＋Cloudflare Tunnel＋Caddy＋PHPでローカルHTTPS接続を追加する方法」という記事。

  • WordPressのテーマにOGP画像の自動設定機能を追加し、サイト共通画像も管理画面で指定した。
  • Xで記事URL https://wp.mf235.com/?p=34 を共有しても、画像付きカードにならず、リンク文字列だけが表示された。
  • URL末尾に &ogptest=1 を追加しても、古い記事のカードは表示されなかった。
  • 一方、新しく作成した別のX投稿では、同じサイトの画像付きカードが正常に表示された。

つまり、サイト全体で画像が表示できないわけではない。特定の共有URLに限って、画像が出ないように見えるのが問題だった。

実際に確認したこと

1. ページのOGPタグは出力されていた

対象記事の公開HTMLを取得すると、次のタグが含まれていた。

<meta name="twitter:card" content="summary_large_image">
<meta property="og:image" content="（設定した画像のURL）">
<meta name="twitter:image" content="（設定した画像のURL）">

og:title、og:description、og:url も存在した。画像はPNG形式、1731×909ピクセル、約1.3MBだった。

2. 外部から画像にアクセスできた

このPCでは wp.mf235.com をローカルの 127.0.0.1 に向けているため、通常のアクセス確認だけでは不十分。そこで公開DNSのアドレスを指定し、Cloudflare経由で取得し直した。

その結果、記事HTMLと画像の双方が HTTP 200 を返した。User-Agentを Twitterbot/1.0 としても、記事と画像の取得は成功した。

ただし、これは「Twitterbotを名乗るHTTPリクエスト」での確認であって、実際のXのクローラー内部の取得結果を確認できたわけではない。

3. robots設定は途中で改善した

調査当初、記事には次の指定があった。

<meta name="robots" content="noindex, nofollow">

WordPressでは「設定 → 表示設定 → 検索エンジンでの表示」によって、このような指定が出る場合がある。後の確認では max-image-preview:large に変わり、noindex, nofollow はなくなっていた。

この設定変更は正常化の一つではあるものの、最初の画像非表示の直接原因だったとは証明できていない。参考：WordPress公式：表示設定。

4. robots.txtには別の問題が残っていた

https://wp.mf235.com/robots.txt を外部経由で取得すると、テキスト形式のrobots.txtではなく、WordPressが生成したHTMLページが 200 OK で返された。サーバーのURLルーティングを別途確認する必要がある。

ただし、この異常とXの画像非表示との因果関係も未確認である。

現在の推測：X側の取得履歴・キャッシュが関係している？

現時点でもっとも疑わしいのは、OGP画像を設定する前にXが記事URLを取得し、そのときの「画像なし」という状態を保持している可能性だ。

  1. まだOGP画像がない時点で記事URLをXに共有する。
  2. XがそのURLのカード情報を取得・保持する。
  3. 後からWordPressのOGP設定を修正する。
  4. 新しいURLでは画像が出る一方、以前のURLでは古いカード情報が使われる。

この筋書きなら観測結果と矛盾しない。しかし、Xの内部キャッシュは確認できていないので、あくまで有力な仮説にとどまる。

また ?p=34&ogptest=1 にアクセスしても、HTML内の og:url と canonical は元の ?p=34 を指していた。Xがそれらを使ってURLを同一視するかどうかは未確認で、クエリパラメータを増やせば必ずキャッシュを回避できるとは言えない。

今後の切り分け方法

  1. 一度もXに貼っていない別の記事URLを、新規投稿で試す。
  2. その記事が画像付きカードになれば、過去のURLだけに起きる問題という見立てを補強できる。
  3. 表示されない場合は、記事ごとのOGP・アイキャッチ・画像URL・クローラー応答の違いを比較する。
  4. 時間を置いて元の記事を再共有し、表示が変わるか確認する。
  5. robots.txt がHTMLになる件は、Xの問題とは分けて修正・検証する。

なお、すでに投稿したXのポストにカードが後から必ず追加されるとは限らない。判定は新規の投稿・新規のプレビューで行う。

暫定結論

WordPress側のOGPタグと画像URLは、調査時点では正常に公開されていた。 それにもかかわらず一部のX投稿で画像が出なかったため、URL単位のキャッシュや取得履歴を疑っている。ただし原因は未確定。

技術的な不具合は、直したつもりでも本当に原因が分かったとは限らない。今回は「ページが正しいこと」と「SNSが正しく表示すること」が別の問題だと分かった。追加検証で進展があれば、結果を追記したい。

コメントを残す