ツイッターカードの画像が表示されない

Question

ツイッターカードの設定をしており、一昨日ツイートした時はちゃんと表示されたのですが、本日ツイートしたら画像が表示されませんでした。
それどころか、昨日まで表示されていた画像まで全て表示されなくなりました。

.htaccessに以下を記述していましたが、ちゃんと画像が表示されていた時から何も変えていません。

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?test.com [NC]
RewriteCond %{HTTP_USER_AGENT} !(twitter|facebookexternalhit|google) [NC]
RewriteRule .(jpg|png|gif|svg|js|css)$ - [NC,F,L]

https://nj-clucker.com/disable-direct-access-to-image-by-htaccess/
↑のサイトさんに、
RewriteCond %{HTTP_USER_AGENT} !(twitter|facebookexternalhit|google) [NC]
↑を書かないといけないと書かれていたのですが、他にこの記述をしているサイトは見つからず、またタイトルに「WordPress」とあるので、WordPressのみ効くものなのでしょうか？
この.htaccessを置いているサイトはWordPressではないです。

とりあえず上記の記述を全て消して再度をアップロードしましたが、ツイッターカードの画像は表示されないままです。
今は.htaccessにはオリジナルエラーページ(404と403)の記述しかしていません。

自ドメイン以外からのアクセスを拒否しつつ、ツイッターカードは表示したいのですが、正しい記述を教えていただきたいです。
よろしくおねがいいたします。

Comments

[CHERRY]

Twitter Card の表示がうまくできない場合は、https://cards-dev.twitter.com/validator でのテストとWebサーバのアクセスログを見ながら調整するしかないとおもいます。

[keigo_8i]

ありがとうございます。 そちらでURLを入れてみたら特にエラーも出ず、翻訳したら 「情報：ページが正常にフェッチされました」 「情報：14メタタグが見つかりました」 「情報：twitter：card =要約タグが見つかりました」 「情報：カードが正常に読み込まれました」 の４つが出てきましたが、画像は表示されません。

Answer 1

"twitter card"というのはこの質問をみるまでしりませんでした。
上記の.htaccessの設定は、画像ファイルの直リンクや、許されているもの以外のエージェントからの閲覧を禁止するものです。

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?test.com [NC]  直前に見ていたページがwww.test.comではない。
RewriteCond %{HTTP_USER_AGENT} !(twitter|facebookexternalhit|google) [NC] ユーザエージェントが twitter等ではない。
RewriteRule .(jpg|png|gif|svg|js|css)$ - [NC,F,L]　その場合forbiddenで返す。

[NC]はNo Case sensitive(大文字と小文字を区別しない)。その他正規表現の説明は省きます。
RewriteCondは列挙した場合 AND で評価されます。否定条件なので、どちらかのルールにマッチしなければRewriteRuleが適用されて403で返します。

この設定を変えてないのに見えなくなったということは、このルールによってforbiddenになったというわけではなく、別の理由で参照できなくなったのではないかと思われます。

以下を試してみてください。

• 画像ファイルへのアクセスログをチェック。なにかエラーがでていませんか。エラーがでているとすると、コードはなにでしょうか。上記ルールでエラーになっているなら 403(Forbidden)になっているはず。
• 許されているユーザエージェントをリクエストヘッダにつけて該当画像URIをリクエスト。参照できるでしょうか。

% wget --user-agent="twitter" http://xxx.com/hoge.jpg

• 上記 .htaccess の設定をすべてコメントアウトうえで、該当画像URIをリクエスト。参照できるでしょうか。

Comments

[keigo_8i]

ありがとうございます。
サーバーはさくらサーバーで、コントロールパネルから見られるエラーログというものを見てみたのですが、初めて見たので何が書いてあるのかさっぱり分かりません..。
ただ「403」という文字列や画像ファイルのパスは見当たらず、テスト用にパスワードでアクセス制限しているページのパスはいっぱい書いてありました。

2つ目の
% wget --user-agent="twitter" http://xxx.com/hoge.jpg
は、どこに入力するのでしょうか？
ブラウザのアドレスバーに入力したらグーグルの検索になってしまいました。
ツイッターカードに使っている画像は、サイト内でも使っているもので、そちらはちゃんと表示されています。

[rogueref]

さくらサーバ上で動作しているApacheのログは参照できませんか？
wgetはどこで動作させてもOKです。ブラウザではありません。ローカルのコンソールでもいいし、wgetがなければ、FirefoxなりでUserAgentを変更して許可しているユーザエージェント文字列で参照できるかどうかを確認してみてください。

自サイト(http(s)?://(www.)?test.com )でも見えるようなので、コンテンツの存在は大丈夫なようですから、あとはmod_rewritreの設定を確認。
.htaccessの設定を一旦全部はずてみても見えないのであれば、apacheの設定は無罪だということになりますね。

[keigo_8i]

かなり遅くなってすみません。
何も変えていませんが数日たったら表示されるようになったので、理由はよくわかりませんが解決です。
いろいろとありがとうございました。