「サブドメイン」「レンタルサーバー」「リダイレクト」をテーマにCopilotに描いてもらった画像


この夏に10年ぶりくらいにPHP（＋SQLite）でちょっとしたWebアプリを作ったのですが、既存の汎兮堂関連サイトはすべてBloggerで運用しているので、Webアプリを置くことができません。そこで、これまた久しぶりにレンタルサーバーを借りてそこに件のWebアプリを置くことにしたわけですが、最終的に現在の形の「汎兮堂のツール用サイト」に落ち着くまで紆余曲折があったので、今後のために備忘録として記録しておくことにします。「サブドメインの一つだけを別のレンタルサーバーに割り当てたい」という方などには参考になる情報もあると思います。


新しいドメインを作ってみたが・・・

レンサバに自作Webアプリを置くのは良いとして、そのドメインをどうするかが問題でした。SEO的に考えると、既存の「hankeidou.jp」にサブドメインを追加して、そのサブドメインをレンサバに割り当てるのが一番良いのはわかっていたのですが、ちょっと難易度が高そうなので尻込みしてしまい、新規に「hankeidou.jp.net」というドメインを取得してレンサバに割り当てました。


しかし、実際にこの新ドメインでサイトを立ち上げてみたところ、ある程度予想していたとは言え、検索エンジンからフル無視される状態が続きました。「hankeidou.jp」からリンクを張れば検索エンジンも理解してくれるのではと思いましたが、全く効果なし。それどころか、「hankeidou.jp.net」にアクセスしようとすると、「開こうとしているのは hankeidou.jp ではありません。騙されていませんか」的なメッセージが出るありさまで、もはや詐欺サイト扱いです。


新規ドメインは評価ゼロからのスタートだから仕方ないのはわかっていても、さすがにへこんでしまい、方針転換を検討せざるを得なくなりました。


しばらく悩みましたが、結局、方針転換するなら早いほうがよいと決心し、「hankeidou.jp」にサブドメインを追加してWebアプリサイトに割り当てる形に変更することにしました。


作業前の状態の確認

というわけで、まずこの時点における保有ドメインの状況は

  • hankeidou.jp：ドメインはムームードメインで取得。ルートドメインのほか５つのサブドメイン（poetry / nipponkanshi / souwa / dendensoken / health）すべてBloggerで開設した各ブログに使用。Bloggerなのでレンタルサーバーは不使用。
  • hankeidou.jp.net：ドメインはムームードメインで取得。ロリポップで契約したレンタルサーバーに割り当ててWordPressをインストール。自作WebアプリはWordPress外のディレクトリに置き、WordPressにはWebアプリに関連する記事をいくつか投稿済み。

という感じ。

せっかく契約したのでロリポップのレンタルサーバーをそのまま使えればベストなのですが、どうもそれがちょっと難しそう。ロリポップではルートドメインと別にサブドメインだけを割り当てることを想定してないようです（やろうと思えばできるらしいですが）。仕方ないので、サブドメインのみの割り当てが可能なXサーバーで新たにレンタルサーバーを契約することにしました。


サブドメイン tool.hankeidou.jp のサイト作成

まずは「hankeidou.jp」に「tool」というサブドメインを新たに作成するわけですが、実際の作業は、ドメインを管理しているムームードメインではなく、Xサーバーのほうから始めます。

Xサーバーでの作業

ムームードメインでサブドメインtoolの設定をする前に、Xサーバーで「too.hankeidou.jp」を登録してしまいます。ただし、Xサーバーでは、ルートドメインの登録なしにサブドメインだけを登録することができないので、ルートドメインの「hankeidou.jp」をダミーで登録する必要があります。ルートドメインの登録はあくまでダミーであって、ムームードメイン側の設定をいじらない限り、実際にルートドメインがXサーバーに割り当てられることはなく、Blogger上でルートドメインで運用しているブログにも影響ありません。ただし、ここでサブドメインtoolを登録した時点ではこのサブドメインは存在していないのでエラーが出ますが、それで問題ありません。


この辺の詳しい作業手順は

エックサーバーでサブドメインのみでホームページを運営する方法

を参考にしました。なお、後で調べてみると、コアサーバーならルートドメインのダミー登録なしでサブドメインのみ登録できるらしいです。もっと早く知りたかった。僕の場合はもはや遅かりし由良之助ですが、これからやる方は、コアサーバーのほうが楽かもしれません（以下のサイト参照）。

サブドメインをまるっと別サーバーで運用する方法


ムームードメインでの作業

次にムームードメインで、「hankeidou.jp」にサブドメイン「tool」を追加し、その設定をおこないます。具体的な方法は以下のサイトを参考にしました。

ムームードメインでサブドメインを設定し別サーバーに割り当てる方法

ただし、僕の場合はメールサーバーとしては用いないので、MX行の設定はおこなっていません。A行のレコードにXサーバーのIPアドレスをコピペで入力するだけです。


ムームードメインでのサブドメイン設定が完了してから１時間くらいで、Xサーバーのサブドメイン設定画面から「反映待ち」が消えて、「tool.hankeidou.jp」にアクセスするとサイトが表示されるようになりました（ただし、読み込むべきファイルが存在しない状態なので「まだサイトが作成されてない」という説明が表示されるだけですが）。


以上でメインの作業は完了で、あとはデータの移行とか残務処理みたいなものですが、それなりに面倒で細かいこともあるので、一通り記録しておきます。


Xサーバーの「SSL設定」を使ってhttpsにする

この時点では「tool.hankeidou.jp」はSSL設定ができていません。きょうび「http://」で始まるURLは勝手に「古いサイト」認定をされてしまいがちですし、SEO的にもよろしくないでしょうから、SSL設定は必須です。さいわい、Xサーバーではサーバーパネルに「SSL設定」という項目があって、そこから簡単に独自SSLを設定できます。設定後しばらくすると反映され、晴れて「https://tool.hankeidou.jp」へのアクセスが可能になります。


httpをhttpsに統一

SSL設定が完了して「https://tool.hankeidou.jp」が出来ても、「http://tool.hankeidou.jp」がなくなるわけではないので、「http」へのアクセスを「https」へ転送することでサイトを「https」に統一しないといけません。


httpからhttpsへリダイレクトするには、Xサーバーのファイルマネージャーを使用して「/hankeidou.jp/public_html/tool.hankeidou.jp」ディレクトリにある「.htaccess」ファイルに３０１リダイレクトコードを書き込む必要があります（Xサーバーにはサーバーパネルに「.htaccess編集」という項目がありますが、これはルートドメイン用でサブドメインでは使えないので注意）。具体的な作業手順、コードの内容は以下のサイトを参照しました。

サブドメインの301リダイレクトを設定しよう


hankeidou.jp.netからtool.hankeidou.jpへのコンテンツ移動

「tool.hankeidou.jp」の入れ物は完成しましたが、中身は空っぽの状態ですので、「hankeidou.jp.net」からコンテンツを移動させないといけません。

  • WordPress内の記事：Xサーバーのサーバーパネルにある「WordPress簡単移行」を使って「hankeidou.jp.net」のWordPressの内容を新サイトにコピーできます。これは楽。
  • Webアプリ：もともと「hankeidou.jp.net」でも手動でアップロードしていたので、「tool.hankeidou.jp」でも同じ（Xサーバーのファイルマネージャーを使用）。ファイルの数は知れているので大したことはない。

以上でコンテンツの移動も完了し、これで「tool.hankeidou.jp」のサイトとしての機能自体は完成したわけです。あとに残るのは、今後の旧サイトへのアクセスを「too.hankeidou.jp」へ転送するための作業です。


hankeidou.jp.netからのリダイレクト

「hanekidou.jp.net」のサイトは短期間しか存在していませんし、検索エンジンからの評価もゼロなので、ここへのアクセスは無視してもいいくらいですが、それでもやはり一人でもアクセスしてくれる人がいるなら新サイトへ誘導したいのがサイトオーナーの心情です。

  • WordPressのリダイレクトは「Redirection」というプラグインがあるので、これをインストールして設定するだけ。
  • Webアプリのリダイレクトは、PHPファイルの中身を「移転のお知らせ」に書き換え、meta refreshをHTMLの<head>に書き込みます。meta refreshではサイトの評価は引き継げませんが、そもそも評価ゼロなので引き継ぐ必要がありません。

これで「hanekidou.jp.net」はサイトとしては閉鎖され、アクセスはすべて「tool.hankeidou.jp」へ転送されます。


全文テキストデータページのリダイレクト

今回のWebアプリサイト立ち上げのそもそものきっかけは、Bloggerで運営している本家サイトのhankeidou.jp（汎兮堂HOME）で、「聯珠詩格全文テキストデータ」を作成・公開したことでした（詳しくは「汎兮堂のツール用サイト」をご覧ください）。この全文テキストデータは「hankeidou.jp.net」を経由して、「tool.hankeidou.jp」に移転されています。よって、このページについてもリダイレクト設定しなければいけません。しかも、「hankeidou.jp」は「hankeidou.jp.net」と違って多少は評価のあるドメインなので、評価の引き継ぎが必須です。

周知のとおり、通常リダイレクトする際は.htaccessファイルを編集して301リダイレクトするのがベストです。評価も引き継げます。ところが、Bloggerでは.htaccessファイルはいじれません。よって次善の策としてHTMLを編集し、meta refreshを設定するしかありません。この場合、「rel='canonical'」を記載しておけば、SEO評価も引き継げる（らしいです）。最悪、評価を引き継げないのはあきらめるとしても、コピーサイトと見なされて評価どころかペナルティの対象となるリスクだけは避けたいところです。

さて、HTMLをいじると言っても、Bloggerの個別記事の編集画面でHTMLをいじるわけではありません。meta refreshはHTMLの<head>内に書き込まなければいけませんが、個別記事の編集画面でHTMLモードにしても<head>内は編集できません。<head>内を編集するには管理画面のテーマからHTMLの編集へ進みます（参考：【Blogger リダイレクト】ブログ全体や記事単位でのリダイレクト方法　）。


Bloggerの管理画面のテーマから、HTML編集画面を開き、[Ctrl]+Fで

「<b:include data='blog' name='all-head-content'/>」を検索し、その部分を以下のように変更します。


<b:if cond='data:blog.canonicalUrl == "転送元URL"'>
  <link rel="canonical" href="転送先URL"/>
  <meta http-equiv="refresh" content="0;url=転送先URL"/>
<b:else/>
  <b:include data='blog' name='all-head-content'/>
</b:if>


リダイレクトしたいページが複数ある場合は、elseifを用いて以下のようにします。


<b:if cond='data:blog.canonicalUrl == "転送元A"'>
  <link rel="canonical" href="転送先A"/>
  <meta http-equiv="refresh" content="0;url=転送先A"/>
<b:elseif cond='data:blog.canonicalUrl == "転送元B"'/>
  <link rel="canonical" href="転送先B"/>
  <meta http-equiv="refresh" content="0;url=転送先B"/>
<b:else/>
  <b:include data='blog' name='all-head-content'/>
</b:if>


以上で、今回のサイト開設・移転に関する作業はすべて完了しました。あまり需要のないHowToだと思いますが、誰かの参考になれば幸いです。