Discourseアプリでウェブクローラーで読み込まれていない場合、Canonical Meta Dataが正しく変更されない

Discourse アプリには、Discourse DOM の <head> セクションにある <link rel="canonical"> メタデータ要素の更新に関するバグがあります。

基本的には、ブラウザクライアントがアプリケーションにアクセスし、最初にアプリが読み込まれると、<link rel="canonical" href=""> 要素はその初期ページロードに基づいて設定されます。しかし、ユーザーがアプリ内でクリックし(通常のユーザー行動)、ページを手動で再読み込みせずに移動すると、<link rel="canonical"> リンクは更新されません。

このバグは、メタサイトでテストし、再現しました。

図 1. ホームページからメタにアクセスすると、タイトル要素と同様に、canonical リンクも正しく設定されています。

図 2. トピックにアクセスします。タイトル要素は正しく変更されますが、canonical リンクは正しくありません(更新されるべきなのに更新されません)。

図 3. 他のトピックにアクセスします。タイトル要素は正しく変更されますが、canonical リンクは正しくありません(更新されるべきなのに更新されません)。

SEO への影響

このバグは SEO に悪影響を及ぼす可能性があります。Google がページをインデックス化する際、Googlebot がすべてのページを「ハードリロード」しない場合、各ページの canonical 情報が正しくなくなります(上記の画像シーケンスのように)。

再現性

このバグは、メタサイトと当社のサイトの両方で一貫して再現しています。

備考

他の Web フレームワーク(Ember だけでなく)でも、同様の node.js(SPA)のライフサイクル問題を目にしたことがあります。これは、Web アプリケーションフレームワーク内の(Ember や他の SPA フレームワークの)ライフサイクルフックに基づいて、DOM 要素が更新されないという問題です。

「いいね!」 1

当サイトでは Googlebot に対して SPA を配信していないため、この問題は発生しません。ユーザーエージェントを Googlebot の UA に設定して、動作を確認することもできます。

「いいね!」 4

@Falco さん、こんにちは

ご返信ありがとうございます。

はい、User-Agent が GoogleBot に設定されている場合は問題ありません(確認済み)。

GoogleBot には SPA を提供していないため、SEO には影響しないかもしれませんが、それでも SPA におけるバグであることは変わりません。

また、GoogleBot に対して SPA を提供しないことの影響についても検討する必要があります。

「ちょっとした事実」を教えていただき、ありがとうございます…:slight_smile:

(注:「Suggested Topics」が GoogleBot には提供されていないとは知りませんでしたが、これで分かりました…ご教示いただきありがとうございます。)

「いいね!」 1

クローラーは JavaScript を実行できない場合があるため、クローラー向けに全く異なるドキュメントを提供しています。Discourse がそのようなクライアントでもアクセス可能になるようにしています。機能は制限されるかもしれませんが、すべてのコンテンツを利用できます。

「いいね!」 5

お知らせいただき、本当にありがとうございます。

これで、SPA(シングルページアプリケーション)や「無限スクロール」、その他のSEO関連の問題について以前行われた議論の多くは、SPAがGoogleBotに提供されていないため、完全に誤っていたと気づきました。

これにより、最近私が書いたカスタムコードへのアプローチも変わりました。また、コンソールでGoogleBotのユーザーエージェント(UA)を確認する必要があることもわかりました。

@Falco さん、本当にありがとうございます。大変感謝しています。

質問です:

GoogleBotにレンダリングされるHTMLに、単一のカスタムJavaScriptファイルを追加する最適な方法は何でしょうか?

ボット向けに提供されるHTMLを変更する「標準的な方法」は存在しますか?

私が尋ねる理由は、ボット向けに作成した私が開発したプラグイン内に、いくつかのカスタムコードがあるためです。しかし、GoogleBotのUAをコンソールで確認したところ(その方法をお教えいただき、改めてありがとうございます)、そのカスタムプラグインコードはGoogleBotによって読み込まれていないことがわかりました。

「いいね!」 1

その間、HTML をクローラーに提供する (Handlebars ベースの) プラグイン内で望むことができないため、Discourse から canonical タグを単純に削除することを決定しました。これは、Web クローラー向けに canonical タグを JavaScript で変更する方法がわかるまでの暫定的な部分的な解決策です。

Discourse では、コンテナの yml ファイルでこのような変更を行うための優れた仕組みが用意されているため、今日はその方法を採用しました。

(識別された) クローラーに提供される Discourse アプリと、ユーザーに提供されるページが異なることを Discourse meta が指摘してくれたことに心から感謝しています。

この「暫定的な解決策」を他の Discourse システム管理者に推奨するわけではありません。現時点で私が決定したことと、その方法 (より興味深い解決策が見つかるまで) を共有しているに過ぎません。

「いいね!」 2