nginx
Twitter
Web

未公開サイトにおけるTwitterカードのテスト方法

概要

例えば、公開前のサイトで確認のために会社のIPからのアクセスのみ許可している場合など、一般に公開していない状態でTwitterカードの表示テストを行いたい場合の対応方法について。

Twitterカードの仕組み

TwitterのクローラーがWebページのmeta情報を取得して表示するようになっている。
Cards markup — Twitter Developers
要は検索エンジンと同じような仕組み。

Twitterカードのテストを行う方法

わざわざテストツイートをしなくても、公式でテスト用ツールを用意してくれている。
Card Validator | Twitter Developers

未公開サイトでテストを行う方法

TwitterのクローラーのIPを許可することによって、Twitterカードの表示が可能となる。
※ 普通にURLをツイートすると第三者からもTwitterカードが確認できる状態になるため、注意すること
厳密にやるなら、URLを推測されにくいものにしたり、テスト用のドメインに配置すべき。本番での最終確認は直前のほうが望ましい。

現在公開されているクローラーのIPは以下。

  • 199.16.156.0/22
  • 199.59.148.0/22

例えばnginxなら以下のような設定になる。

location /hoge {
  allow xxx.xxx.xxx.xxx; # 会社IPとか
  allow 199.16.156.0/22; # Twitter crawler
  allow 199.59.148.0/22; # Twitter crawler
  deny all;
}

参考:Troubleshooting cards — Twitter Developers

Your web host may be blocking web crawler access to your site. You should contact your hosting provider and ask them to ensure they are not blocking Twitter access by either IP or ASNUM. Twitter’s aggregate outbound IP ranges are 199.16.156.0/22 and 199.59.148.0/22. Twitter’s ASNUM is AS13414.