GItHub Pagesから他サイトへのリダイレクト設定をページ毎に行う (jekyll-redirect-from使用)

論よりコード

GitHub PagesのRootに指定されているフォルダ内に jekyll-redirect-from を使うと宣言した _config.yml を配置し、リダイレクトしたいHTMLファイルの中身にリダイレクト先を redirect_to で指定すれば実現できます。

サンプルをこちらに置いておきました。 : https://github.com/ma2shita/example-for-jekyll-redirect-from
※注意: catch all的な方法は未調査です。

_config.ymlの作成と配置

$ cd YOUR_GITHUB_REPO/ROOT_OF_GITHUB_PAGES/
$ cat << _EOT_ > _config.yml
plugins:
  - jekyll-redirect-from
_EOT_
$ git add . && git commit -m "Add jekyll-redirect-from" && git push

https://GITHUB_PAGES/YOUR_GITHUB_REPO/foo/bar.html を https://example.jp/dest.html にリダイレクトする設定はHTMLファイルに書きます。

HTMLファイルにリダイレクト先を書く

$ cd YOUR_GITHUB_REPO/ROOT_OF_GITHUB_PAGES/
$ cat << _EOT_ > foo/bar.html
---
redirect_to: "https://example.jp/dest.html"
---
_EOT_
$ git add . && git commit -m "Redirect" && git push

以上です。

GitHub PagesではMETAタグによるHTTP 200リダイレクト

GItHub Pagesから他サイトへのリダイレクトは jekyll-redirect-from が利用できます。
ただしリダイレクト手法はHTTP 200リダイレクト、いわゆるMETAタグによるHTMLリダイレクトです。

GitHubの公式には書いてありませんが、GitHub Pagesは .htaccess といったHTTP 3xxによるサーバサイドリダイレクトをサポートしていないようです。GitHub Pagesで使えるプラグイン一覧にjekyll-redirect-fromが入っているのはそういった背景だと考えられます。

HTMLファイル内の書式

HTMLファイルではありますが、以下の書式となります。

---
redirect_to: "https://example.jp/dest.html"
---

リダイレクト設定済みで出力されるHTMLの例

<!DOCTYPE html>
<html lang="en-US">
  <meta charset="utf-8">
  <title>Redirecting&hellip;</title>
  <link rel="canonical" href="https://example.jp/dest.html">
  <script>location="https://example.jp/dest.html"</script>
  <meta http-equiv="refresh" content="0; url=https://example.jp/dest.html">
  <meta name="robots" content="noindex">
  <h1>Redirecting&hellip;</h1>
  <a href="https://example.jp/dest.html">Click here if you are not redirected.</a>
</html>

SEOへの懸念

HTTP 3xxリダイレクトでないと心配になるのがSEOですが、結論としては大丈夫そうです。

W3C では、このタグを使用しないよう推奨しています。Google では、サーバーサイドの 301 リダイレクトを使用することをおすすめしています。
https://support.google.com/webmasters/answer/79812?hl=ja

以上のようには書かれていますが、サポートはされているので「しょうがないなぁ...」というお気持ちなんだと推測できます。

ただ、検証結果を見つけられなかったので、過度な期待は禁物です。また、できる限りGitHub Pagesのコンテンツへリンクしている部分をリダイレクト先に書き換える事をおすすめします。

ディレクトリインデックスにも設定可能

https://GITHUB_PAGES/YOUR_REPO/foo/ と、ディレクトリインデックスを https://example.jp/foo/ にリダイレクトしたい場合は index.html を対象にします。


$ cd YOUR_GITHUB_REPO/ROOT_OF_GITHUB_PAGES/
$ cat << _EOT_ > foo/index.html
---
redirect_to: "https://example.jp/foo/"
---
_EOT_
$ git add . && git commit -m "Redirect" && git push

あとがき

catch all的な方法は未調査ですが、だいたいこういう時って除外したいとか書き換えルールが微妙に異なることがあるので、１つ１つ丁寧にやった方が良かったりします。

SEOのところでも書きましたが、なるべく早くリンク元の修正をしていきたいですね。

EoT