年間で12ドル(1,400円)なので、サクッと買っちゃって、このブログをblog.pirox.dev
に移行してみました。
もともと「pirox.com」が欲しかったのですが、すでに誰かに取得されてしまっていて泣く泣く「blog.pirox.dev」というアホっぽいドメインを使っていた経緯があります。これで気持ちよくブログを運営できます。
前提
このブログはAWSのLightSailで用意されているWordPressイメージ(bitnami)を使って構築しています。
また、非SSL対応のまま放置しており、Chromeにアラートを出されちゃうようなブログだったので、SSL対応も一緒に実施しました。
作業の流れ
こんな感じです。フル活用は言い過ぎかもしれないです。
devドメインの取得
Google Domainsでdevドメインを購入します。
- お好みのドメイン名を入力して購入可能かチェック。(早い者勝ち!!)
pirox.dev
が取得可能だった。購入可能なら緑のチェックマークが付いている。+マークをクリック後、カートマークをクリックしてお会計へ。
※購入時にキャプチャとるの忘れてたので、↓の画像は購入後に再検索したもの。 (Unavailableとなっているのはそのせい。)
- Registrationの設定画面
- その後、契約者情報として名前やクレカ登録、レジストラの指定、連絡先メールアドレスのバリデーションがあったはず。よしなに進めてください。
これでdevドメインをゲットできました。
devドメインの特徴に「HSTS(HTTP Strict Transport Security)」機能があります。これは当該ドメインへの接続をHTTPSに限定する、というもので、HTTPでアクセスすると強制的にHTTPSへ切り替えられます。HTTPS非対応のWebサイトに警告出したり、devドメインはHSTSにしたり、オレたちがインターネットをつくってるんだ感がいいですね、Google。
ブログをdevドメインに移行
いくつかのステップを踏んで、このブログをblog.pirox.dev
に移行しました。
ドメインの管理をRoute53へ
AWS側でドメインのレコードを管理した方が楽なので(ACM証明書の発行とか)、Route53に管理を移行します。
- Route 53 でHostedZoneを作成
- Google DomainsでName serversの設定
ACMによるSSL証明書の発行
AWS Certificate Manager (ACM) で、AWS発行のSSL証明書(無償)を取得します。
- Certificate Manager
DNSの検証画面が表示され、検証用のCNAMEレコードを登録するよう指示されます。対象ドメインをRoute53で管理していると、クリック一つで自動登録してくれるので便利です。
CNAMEレコードを登録後、5分ほどで証明書が有効になります。状況が発行済み
になればOKです。
↑名前はNameタグを設定することで任意の文字列を表示できます。
CloudFrontでSSL対応 & WordPress用のカスタマイズ
ちょうどクラメソさんが記事を書いてくれていたので、こちらを参考に進めました。
基本的にこのまま設定していけばOKです。というか、この通り設定しないとエラーになります。(なりました。)CloudFrontの設定ミスってWordPressの管理画面に入れなかったり、コード記述場所をミスってブログにアクセスできなくなったり。。写経するが如く、記載の通り進めてください。
これでdevドメインへの移行が完了です。
旧ドメインからのリダイレクト
このブログを立てて半年ほど経つのですが、ブログ名「ぴろログ」でググるといつの間にかトップに表示されるようになっていました。
ブログを始めたときから「検索で一番をとれたらいいなぁ」とは思っていたのですが、ほとんど記事を書かずに目標を達成。ブログ名を決めるときにリサーチした甲斐がありました。(他のぴろログさんは更新止まってた。)
そういう訳で、旧ドメインから新ドメインへのリダイレクトが必要です。 どういう訳かというと、検索結果を見ての通り、現時点でこのブログは「https://blog.pirox.dev」で認識されています。これを捨ててゼロからblog.pirox.devで得点稼ぎをするのはもったいないので、リダイレクトで繋いであげて、過去の資産をそのままに移行するのが目的です。いわゆるSEO対策ってやつです。また、どこかにいらっしゃるかもしれない過去記事のリンクを持っている方に申し訳ないですしね。
で、お馴染みの.htaccessファイルでリダイレクト処理をかけようとするもうまくいかない。。なんでやねんと調べていると、どうもbitnamiイメージのWordPressはセキュリティ上の理由で.htaccessファイルを無効にしているらしいです。
んでんで、/opt/bitnami/apache2/conf/bitnami/bitnami-apps-prefix.confにリダイレクトの記述を入れるっぽい。 Understand The Default Apache Configuration / bitnami Documentation だけどなかなかうまくいかない。。 こうして、わたしはフルマネージドAWS先輩を頼ることにしました。
AWSのS3のWebホスティング機能とCloudFrontを使って、Webサイト移転時のリダイレクトを実現できます。 CloudFrontを使うのは、S3だけではカスタムドメインのSSL対応が実現できないから。つまり、http://blog.pirox.devはリダイレクト可能だけど、https://〜でアクセスされるとリダイレクトNGです。この制約に気づかずS3だけで構築して満足していました。後日HTTPSで接続した際に、私の戦いがまだ終わっていなかったことを悟りました。
前置きが長くなりましたが、設定方法です。 こちらの記事を参考にさせていただきました。
S3の設定
- S3のコンソール画面
CloudFrontの作成
- CloudFrontのコンソール画面
- Create Distribution
- Webを選択して「Get Started」
- 各種設定(記載のしていないところはデフォルト値のまま)
- Origin Settings
- Origin Domain Name:S3のウェブホスティング用エンドポイント
- 今回は
blog.pirox.dev.s3-website-ap-northeast-1.amazonaws.com
- 今回は
- Origin ID:
custom-blog.pirox.dev
- Default Cache Behavior
- Distribution Settings
- Origin Domain Name:S3のウェブホスティング用エンドポイント
- 「 Create Distribution」をクリックしてデプロイ開始
- 時間かかかります。結局1時間ぐらい待ちました。
- Origin Settings
Route 53でALIASレコード登録
旧ドメイン (blog.pirox.dev
)をCloudFront(d3oxu3f7e55lpe.cloudfront.net
)に紐付けます。
- Route53
blog.pirox.dev
のAレコード
を選択。- Alias:Yes
- Alias Target:
d3oxu3f7e55lpe.cloudfront.net
これで https://blog.pirox.dev から https://blog.purix.dev にリダイレクトされるようになりました。
いやー、ここまで長かった。
つぶやき
お気づきの方もいらっしゃるかもですが「www.blog.pirox.dev」も同様にリダイレクト処理しています。(CNAMEで「blog.pirox.dev」と紐付けたのですが、うまくリダイレクトされなかったので。)
あと、エラー対応での設定変更時にCloudFrontが旧キャッシュを返してくるので、そこに気づかずハマったりしました。設定を変えてアクセスし直しても、それが反映された画面にならず。 裏側の設定を変更したときはCloudFrontのキャッシュを削除(Invalidation)することをお忘れなく。(もちろんWebブラウザのキャッシュも。)
今回いろいろ大変で、はてブロ使っときゃ良かったな、、と思いました。