JavaScriptでrel="canonical"を挿入
先日JavaScriptでrel=canonicalをGoogleは処理できるという記事があった。
JavaScript挿入したrel=canonicalをGoogleは処理できる
記事にはやり方の詳細は書かれていないが以下のようにJavaScriptを書けば実装できる。
JavaScriptだけで挿入といっても、ページ内にすでにrel="canonical"が存在している可能性もあるため、document.querySelector('link[rel="canonical"]')で存在の有無を確認するよう注意が必要。
1 2 3 4 5 6 7 8 9 10 | const canonicalUrl = location.href.split('?')[0]const isCanonical = !!document.querySelector('link[rel="canonical"]')const link = isCanonical ? document.querySelector('link[rel="canonical"]') : document.createElement('link')link.setAttribute('rel', 'canonical')link.setAttribute('href', canonicalUrl)if (!isCanonical) { document.head.appendChild(link)} |
実際に上記のコードを実行したサンプルページを作成したので確認してみてください。
URLのパラメーターは除去するようにしてありますのでパラメーター付きは以下のように正規化されます。
https://iwb.jp/s/javascript-rel-canonical-google-seo/?foo ↓ https://iwb.jp/s/javascript-rel-canonical-google-seo/
https://iwb.jp/s/javascript-rel-canonical-google-seo/?foo
