お名前.comの独自ドメインでAWSのS3でWeb公開
お名前.comで取得している独自ドメインでAWSのS3でWebを公開する方法をご紹介します。セキュリティを考慮しなければ、爆速で爆安です。S3は従量課金で非常に安いです。クラウドのメリットであり使い倒さない手はないですよね。今回は、独自ドメインをS3で静的ホスティングによりWeb公開する方法をご紹介します。
AWSで静的Webホスティング
まずはAWSで静的Webホスティングを行いWebページを見ることができるようにします。
AWS_S3でバケットを作成します。バケット名はお名前.comなどで取得した独自ドメインの名前で設定します。
その他の設定は変更せず、一旦バケットを作成します。

作成後、プロパティタグから一番下に静的ウェブサイトホスティングの設定項目があります。編集を押して有効化していきましょう。

index.htmlや404.htmlを設定します。

静的ウェブホスティングができました。外部公開の設定もしましょう。
アクセス許可タブから「パブリックアクセスをすべてブロック」のチェックをはじます。

バケットポリシーの設定も必要です。編集を押して設定しましょう。

対象のS3を外部からGetできるようにします。
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::learning-english.algo-ai.work/*"
}
]
}
S3で公開したWebにアクセス
S3でプロパティタグから「バケットウェブサイトエンドポイント」にURLが記載されています。クリックしてアクセスできるか試してみましょう。
まずは、index.htmlのファイルをアップロードしましょう。「Hello,World」と書いただけのhtmlファイルでもOKです。
その後、「パケットウェブサイトエンドポイント」のURLをクリックしてページが見れることを確認します。

お名前.comで独自ドメインをS3に紐づける
お名前.comでcnameを設定して、独自ドメインからS3のURLへアクセスできるようにします。
DNSでCNAMEの設定を行います。
CNAMEレコードとは、別名に正式名を紐づけることができる仕組みです。AWSにFQDNでアクセスできている状態ですので、正式名と紐づけて独自ドメインでアクセスできるようにします。
お名前.comにアクセスして、ドメインタブから「ドメインのDNS設定」をクリックします。

DNSレコード設定を利用するの「設定する」ボタンをクリックします。

レコードの追加をします。TYPEの「CNAME」を選択して、ホスト名はサブドメインの任意の名前、VALUEにはAWS S3のURLを記載します。追加ボタンをクリックして、確認して設定します。

少し時間が経ってから、ブラウザでアクセスしてS3のindex.htmlページが見れれば成功です。
終わりに
お名前.comの独自ドメインでS3でウェブサーバを公開する方法をご紹介しました。AWSのS3は従量課金で非常にお安いので、是非お試ししてみてください。実際にはCloud Frontと連携してCDNやSSL化を行うと、企業レベルでのウェブサイトができると思います。Cloud Front連携は別記事にてご紹介したいと思います。
よろしければTwitterフォローしてください。