2023年不動産屋が15分でお名前コムの独自ドメインでAWSのS3でWEBサイトを公開してみた。

こんにちは。花沢不動産エセ社内SEのたつやです。

今日は、インターネットとWEBサイトの違いがよくわかっていない僕がAWSを使って静的なWEBページを15分で構築してみることを記事にしようと思います。

１．AWSのS3でバケットを作成

AWSにログインして、一番上にある検索BOXに「S3」と入力します。

一番上にS3が出てくるので、気軽な気持ちでポチッと押します。

はい。オレンジ色のバケットを作成ボタンを押しましょう。

・バケット名（お名前コムでGETした独自ドメインを入力しましょう。）

✕　http://aaaaa.com

✕   aaaaa

◯　aaaaa.com

・AWSリージョン（東京を選んでおきましょう。怖いので）

あとは初期設定のまま、一番下までスクロールして

バケットを作成します。

登録後はバケット一覧に先程追加した独自ドメインがあるはずです。名前をクリックして詳細設定画面に進みます。

AWS S3の静的サイト設定

上記画面までは進められましたか？分からなくても当社に電話をしてくるようなことは無いようにしてください。WEB屋さんに頼んでくださいね。

プロパティをクリックして一番下までスクロールすると、「静的ウェブサイトホスティング」という項目があるので、編集を押して有効にしましょう。

有効にすると、設定ができるようになります。

・インデックスドキュメント（index.hmtlと入力）

・エラードキュメントオプション（404.htmlと入力）

できましたか？次はアクセス許可をクリックします。

ブロックパブリックアクセス (バケット設定)の編集を押しましょう。

かんたんですね。

はい。パブリックアクセスをすべてブロックのチェックボックスを解除して、変更の保存を押します。何も考えず無の境地です。

浮気の証拠になるような写真などをアップロードしてしまっていても、すべて公開されてしまいますよ。大丈夫ですか？と聞かれています。入力欄に「確認」と入力します。

確認を押したあとに下にスクロールすると「パケットポリシー」が出てきます。こいつを編集してやらないと404エラーが出て使い物にならないので編集しましょう。

{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": {
"AWS": "*"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::aaaaa.com/*"
}
]
}

aaaaa.comの部分をお名前コムで取得した独自ドメインに変更してください。

ore-no-saikyou-fudousan.comが取得したドメインであれば

{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "PublicReadGetObject",
"Effect": "Allow",
"Principal": {
"AWS": "*"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::ore-no-saikyou-fudousan.com/*"
}
]
}

こうですね！わかりやすい。

お名前コムで独自ドメインをS3に設定する

さて、AWSの設定はとりあえず置いといてお名前コムにアクセスしましょう。

お名前コムはNetflixを見るよりも皆さん見ていると思うので、詳細の説明は省略します。

DNS設定のドメイン選択画面になぜ検索窓がつかないのか8年前から謎だなと思っていたのですが

DNS設定でシーネームの設定をちょちょいのちょいとやってしまえば・・・

ただ、今回はRote53を使いましょうか。AWSに詳しいです。って言えたほうがかっこいいし。

AWSのRoute53にてホストゾーンの設定を行う

不動産ソルジャーの皆さんであれば、AWSの検索BOXに「Route53」とすでに入力してRoute53のダッシュボードにアクセスしているとは思います。

ホストゾーンをクリック。

ホストゾーンを作成します。

ドメイン名にお名前コムで取得したドメインを入力します。

aaa.comとかbbb.netがドメインです。自分で設定したものを入力しましょう。入力したらホストゾーンを作成してしまいます。

そうすると、こんな感じで赤枠に囲われた4つの値が出てくるかと思います。とりあえず深いことは考えずにこれらをメモ帳にコピペしましょう。

お名前コムにログイン

ログイン→ネームサーバーの設定→該当ドメインをチェック→他のネームサーバーを利用

ここまでは、普段から不動産業に従事している方ならお手の元かと思いますので説明を省略します。

おそらく何も設定していない取得したばかりのドメインは、このような形になっているかと思います。なので、この1プライマリネームサーバー以下4行をさきほどメモ帳にコピペした呪文のような英数字を貼り付けます。

※たぶん、Rote53の英数字の最後に「.」ドットがついているかと思いますが、ドットがついているとお名前.com側のネームサーバーに登録できないので最後についているドットだけ削除してください。

反映されているかの確認

レインズ・アットホーム・コマンドプロンプトと言われているくらい不動産業界にとっては三種の神器でもあるコマンドプロンプトを使って反映の確認が可能です。業歴1年目の方は、

先輩に「ターミナルでエヌエスルックアップのやり方教えてください」

と伝えれば以下の2パターンの返答が予想できますので参考にしてください。

A　「おまえ会社のパソコンはWindowsだからCMDだろ。マカーかよ」

B　「とんでもない新人があらわれた。社長！◯◯くんは天才です！」

99％上記の回答になりますので1％を引いてしまったら素直にググりましょう。

Rote53に戻ってレコードを作成

オレンジ色のレコードを作成を押します。

上記と同じように設定してください。

・エイリアス　On

・S3ウェブサイトエンドポイントへのエイリアス

・アジアパシフィック東京

・s3…………………………………amazonaws.com

レコードを作成しましょう。

S3に戻ってindex.htmlをアップロードしてみる

アップロードボタンを押して、index.htmlをアップロードしてみると表示されることが確認できたかと思います。

このあと本当はCloudFlontをつかってSSL化をしたりと色々あるみたいですが、ニワカ社内SEのぼくにはなんのことかさっぱりわかりませんでした。

花沢不動産の公式LINEに登録して質問してくるのだけは、本当にやめてください。たぶん不動産チャットスタッフに冷やかしだと思われて無視されると思います。

それでは！