リダイレクトの色々【DNS, Apchce HTTP header, HTML meta, JavaScript】-自動化モジルカ

どうもどうも、ひつじさん(@youmounlp)です。

今日はHTTPリダイレクトのまとめです。

リダイレクトの色々

HTTPリダイレクトにも色々やり方があります。

DNSのURL転送機能
HTTP header (Apahce)
HTTP header (PHP)
HTMLのmetaタグ
JavaScript

結論から言うとApacheなどのウェブサーバーの機能を使ったHTTP headerによるリダイレクトが1番確実＆正攻法っぽいです。
　
ただなんか博識な感じがするので他のも知っておきましょう。
　
目的としてはサーバーのお引っ越し、HTTPSへのリダイレクトが多いと思います。

DNSのURLの転送機能

本来DNSにはURL転送機能はありませんが、一部のDNSには付帯サービスとしてURL転送機能があります。
　
「DNS　URL転送機能」等でぐぐると国内のサービス含めいくつか使えるところが見つかります。基本的には、DNSのウェブ設定画面でポチポチするだけなのでめっちゃ楽です。
　
パスの転送ができるか、リダイレクトコード(301 or 302)が選べるかは、DNSが対応しているかどうかによります。Google Domainsは対応していました。
　
ドメインお引っ越し、HTTPからHTTPSへのリダイレクトの両方で使えます。
　
メリット😍
DNSの設定画面だけで完結するので管理が楽
URL転送用のサーバーがいらない
　
デメリット😱
DNSが対応してないと使えない
基本的に複雑な条件分岐はできない

HTTP header (Apache)

実績抜群の正攻法です。
レンサバだと各サイトディレクトリに.htaccessをおく感じだと思います。いくつかパターンがあります。
　
移行先のディレクトリ構造がまったく同じ場合
https://your-domain.com/からhttps://your-new-domain.com/への移行

Redirect temp / https://your-new-domain.com/

または

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^/?(.*)$ https://your-new-domain.com/$1 [R=302,L]
</IfModule>

どちらもパスも一緒に転送してくれます。
　
1つ目の方法ではpermanentが301、tempが302になります。301で転送するとブラウザが記憶してしまうのでミスったときに面倒です。開発時はtempまたは302でテストしましょう。
　
移行先のディレクトリ構造が異なる場合
https://your-domain.com/からhttps://your-new-domain.com/aaa/への移行

RedirectMatch temp ^/?(.*)$ https://your-new-domain.com/aaa/$1

または

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^/?(.*)$ https://your-new-domain.com/aaa/$1 [R=302,L]
</IfModule>

このように別のドメインに飛ばす場合は一緒ですが、同じドメイン内では挙動が異なります。
　
2つ目の方法で

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^/?(.*)$ /aaa/ [L]
</IfModule>

とすると、ブラウザのアドレスバーがyour-domain.comのままyour-domain.com/aaa/を見ることができます。これはパスや拡張子を隠すといった用途にも使われます。
　
また、同じドメインにおけるHTTPSへのリダイレクトも可能です。

<ifModule mod_rewrite.c>
  RewriteEngine On
  RewriteCond %{HTTPS} off
  RewriteRule ^/?(.*)$ https://your-domain.com/$1 [R=302,L]
</ifModule>

特にサイトお引っ越しの場合は、SEO評価を引き継ぐためにこれらの方法を用いた301リダイレクトが推奨のようです。
　
本番環境では、permanentおよび301を使いましょう。
　
(参考)
https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/Location
https://httpd.apache.org/docs/2.2/ja/mod/mod_alias.html
　
メリット😍
.htaccessだけ完結するので管理が楽
複雑な条件分岐が可能
　
デメリット😱
4つの中では一番プログラミング感があり初心者にはちょっと怖い
レンサバによってはApacheの設定ファイルが編集できないことがある

HTTP header (PHP)

Apacheの.htaccessなどが使えないときはこちら。

<?php
header('Location: https://your-new-domain'.$_SERVER["REQUEST_URI"], 301);
exit();
?>

結局、HTTPのheaderを用いてリダイレクトする点は一緒です。そのheaderをApacheで出力するか、PHPなどのサーバーサイドプログラムで出力するかの違いでしかないです。
　
メリット😍
複雑な条件分岐が可能
　
デメリット😱
ページごとに設置が必要
PHPが動くサーバーがないと機能しない

JavaScript

これが一番イメージはつきやすい。

<script>location.href="https://your-new-domain.com/";</script>

秒数を指定する場合はsetTimeoutと組み合わせる。
　
パス転送はできません。クライアントサイドで動的にパスを拾ってlocation.hrefを書き換えるのはセキュリティ的に危険なのでやめましょう。
　
また、HTTPSへのリダイレクトに使えません。HTTPS転送後も同じJavaScriptを見るので、リダイレクトループになってしまいます。
　
メリット😍
1行書くだけなので簡単
クライアントサイドの条件分岐でリダイレクトできる
　
デメリット😱
ページごとに設置が必要
ブラウザでJavaScriptをOFFにしていると機能しない

HTMLのmetaタグ

HTMLのmetaタグに以下のように書いてもURL転送が可能です。

<meta http-equiv="refresh" content="10;URL=https://your-new-domain.com/" />

10秒後に新しいドメインへ飛びます。
　
こちらの方法は随所で非推奨とされていますが、非常に手軽なので.htaccessが使えない場合の最後の救済策として覚えておくと良いと思います。
　
パス転送ができない、HTTPSリダイレクトに使えない点はJavaScriptと一緒です。
　
メリット😍
1行書くだけなので簡単
HTMLなので確実に動く
　
デメリット😱
ページごとに設定が必要
SEO評価をスムーズに引き継げないとの意見あり
複雑な条件分岐はできない

まとめ

動作順はDNS→HTTP header→HTML meta→JavaScriptになります。
　
可能であればApacheでHTTP headerを出力するのが安全。

リダイレクトの色々【DNS, Apchce HTTP header, HTML meta, JavaScript】