LoginSignup
12
20

More than 5 years have passed since last update.

無料ドメイン(.tk)とRoute53を利用してHTTPS環境を設定してみた

Posted at

概要

無料ドメイン(.tk)とRoute53を利用して0円でHTTPS環境を設定してみたを大いに参考にさせていただき、HTTPS環境を構築した、メモを残します。

No Web 利用サービス
1 ドメイン Freenum
2 DNS Amazon Route53
3 Webサーバ Amazon S3
4 証明書発行 AWS Certificate Manager (ACM)
5 CDN(コンテンツ配信ネットワーク) Amazon CloudFront
6 ドメイン認証メール Amazon SES

構築手順

freenom作業(1)

アカウント取得

  • ドメインレジストラのfreenomのアカウント、事前に取得
  • Googleアカウント連携が便利ですが、メールアドレス、パスワードによる登録可能

空ドメイン確認

  • ドメインとして利用を希望する文字列を記入しチェック
  • 利用可能なドメインが表示
  • 4文字以上、予約文字列以外のドメインが無償提供対象

今回は、 freedom-domain-test.tkというドメインを取得しました。

AWS作業 (1)

Hosted Zone作成

  • 今回取得するドメインのDNS、Amazon Route53 管理とするためZone作成
  • AWSコンソールのRoute53画面で取得予定のドメイン名を指定し、Hosted Zoneを作成

01_FireShot Capture 009 - Route 53 Management Console_ - https___console.aws.amazon.com_route53_home.png

  • Hosted Zone の作成後、NSレコードが4件生成されます。これらをレジストラに登録のために控える。

freenom作業 (2)

DNS 設定

  • 申し込むドメイン名を管理するDNS設定を実施
  • ドメインレジストラ提供のDNSではなく、任意のDNSを利用する設定(Use DNS)
  • Route53で発行した、NSレコードをNameserverとして登録
  • DNSレコードとして入力可能な欄は2件に限られる為、一旦2件のみを登録
  • Nameserver指定時、末尾の「.」は不要

チェックアウト

  • 費用が0$、登録内容を確認の上、申込みを実施 ### DNS 追加設定
  • Route53で発行されたNSレコードとして指定されたDNS障害に備え、4つのNSレコードを反映する場合には、追加でDNS設定
  • Nameserver3,4 の欄に、Route53で作成されたNSレコードを追記

AWS作業 (2)

S3 設定

S3 バケットの作成

  • AWS コンソール を利用し、S3バケットを作成します
  • S3のバケット名は「freedom-domain-test.tk」
    • S3バケット名と公開FQDNを揃える事で、Route53設定でCDN(CloudFront)を切り離し、S3のみで「http://freedom-domain-test.tk」の提供が可能になります。

コンテンツの設置

  • Web公開するコンテンツとして、今回は画像ファイル(01_Astral_travel_to_other_worlds.jpg)、1ファイルのみをS3に転送。
    • 再利用可能なフリー画像

バケットポリシー設定

  • Web公開用のS3に設置されたファイル、誰でも参照出来る状態とするため、バケットポリシーの設定
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "AddPerm",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::freedom-domain-test.tk/*"
        }
    ]
}

静的ウェブサイトホスティング設定

  • 静的ウェブサイトホスティングを有効化
  • インデックスドキュメント、通常は「index.html」としますが、今回は表示確認の簡略化のため、画像ファイル(jpg)を利用する設定
  • エンドポイントとして示されたURLをWebブラウザで開くと、先程S3にアップロードした画像が表示される。 endpoint-access.PNG

SES準備

  • ACMのドメイン認証メールを受け取るため、SESのメール受信設定
  • サブドメインを管理しているRoute53と同一のAWS環境を利用
  • SESのリージョンは、日本から近いオレゴンを利用 ### ドメイン認証 #### SESのドメイン認証を実施
  • メール受信を希望するサブドメインを指定し、「Verify This Domain」クリック
  • 「Verify This Domain」をクリック
    09_FireShot Capture 019 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

  • 「Use Route53」をクリック
    10_FireShot Capture 020 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

  • 「Domain Verification Record」、「Email Receiving Record」、「Hosted Zones」のチェックをオンにして、「Create Record Sets」をクリックして、完成。
    11_FireShot Capture 034 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

12_FireShot Capture 035 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

メール受信設定を実施

事前準備として、S3に認証メール受信用のバケット「mail.freedom-domain-test.tk」を作成しておく。

  • 「Email Receiving」の「Rule Sets」をクリック
  • 「Create a Reciept Rule」をクリック
    14_FireShot Capture 024 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

  • ドメイン名を入力し「Add Receipt」をクリックし、「Next Step」をクリック
    15_FireShot Capture 025 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

  • 「Add action」でS3を選択し、事前に作成した「mail.freedom-domain-test.tk」を選択

  • 次いで、「Add action」から「Stop Rule Set」を選択し、「Next Step」をクリック
    16_FireShot Capture 026 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

  • 「Rule name」を設定し、「Next Step」をクリック
    17_FireShot Capture 027 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

  • 確認画面で入力内容を確認し、「Create Rule」をクリックして完成。
    18_FireShot Capture 028 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png
    19_FireShot Capture 029 - SES Management Console_ - https___us-west-2.console.aws.amazon.com_ses_home.png

ACM設定

  • バージニア北部でACM設定を行う。
  • 「パブリック証明書のリクエスト」を選択
    20_FireShot Capture 042 - AWS Certificate Manager_ - https___console.aws.amazon.com_acm_home.png

  • ドメイン名を追加。今回、サブドメイン用に用意する証明書、ZoneApex、ホスト名を省略したサブドメインのみのURLに対応するため、マルチドメイン証明書を発行。
    21_FireShot Capture 043 - AWS Certificate Manager_ - https___console.aws.amazon.com_acm_home.png

  • 「Eメールの検証」を選択し、「確認」ボタンをクリック
    22_FireShot Capture 044 - AWS Certificate Manager_ - https___console.aws.amazon.com_acm_home.png

  • 確認画面で入力内容をチェックし、「確定とリクエスト」ボタンをクリック
    23_FireShot Capture 045 - AWS Certificate Manager_ - https___console.aws.amazon.com_acm_home.png

  • 以下の画面に遷移すると、 S3に認証メール受信用のバケット「mail.freedom-domain-test.tk」に認証メールを受信していることが確認できる。
    24_FireShot Capture 046 - AWS Certificate Manager_ - https___console.aws.amazon.com_acm_home.png

  • S3で受信したファイルをダウンロードし、「https:」で開始する行のみを抽出することで、認証用URLを2件抽出できる。

  • 抽出したURL2件をブラウザでそれぞれ表示し、「I Approve」ボタンをクリックしACMの認証は完了
    08_FireShot Capture 036 - Amazon Certificate App_ - https___us-east-1.certificates.amazon.com_approvals.png

CloudFront 設定

Distribution 作成

  • AWSコンソール、CloudFrontの画面より「Create Distribution」→Web「Get Started」に進む。 25_FireShot Capture 048 - AWS CloudFront Management C_ - https___console.aws.amazon.com_cloudfront_home.png

Origin Settings

Origin Domain Name は、S3のWebホスティングのエンドポイント「freedom-domain-test.tk.s3-website-us-west-2.amazonaws.com」、カスタムオリジンを指定します。
カスタムオリジンを指定しなかったがために、表示までにえらいハマったので、元サイトの指示通りに設定する。
26_FireShot Capture 049 - AWS CloudFront Management C_ - https___console.aws.amazon.com_cloudfront_home.png
* 「Distribution Status」が「Deployed」になったら完成。

Route53設定

DNSレコード登録

  • 「.tk」ドメインでの公開を可能とするため、Route53のレコード設定を実施
  • 公開URLは「 https://freedom-domain-test.tk」、「 http://www.freedom-domain-test.tk」の2つ用意
  • DNSレコードは「Alias」として設定する事で、名前解決クエリに対し発生する利用量は無料で利用可能
  • Alias Targetは、「CloudFront Distribution」として表示された「freedom-domain-test.tk」を指定
    • Taget欄の選択表示に時間がかかる場合、先に作成したCloudFrontのDomainNameを直接入力

確認

https://www.freedom-domain-test.tkにアクセスすると、HTTPS化されていることが確認できる。
endpoint-access-https.PNG

アクセスログ設定等は今後行う予定。

おしまい。

12
20
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
20