はじめに
AWSを使ってWebサイトを公開するまでの手順のメモです。AWSの知識がゼロで、「S3って何？」「バケットって何？」というようなレベルから、公開にこぎつけました。
AWSに動的なサイトを公開するまでの手順は、以下の記事を参照してください。
AWS EC2上にPHPのWebサイトを公開して、「Hello World」を表示するまでの全手順
AWSはクラウドサービスである
AWSとは、Amazon Web Serviceの略で、Amazonが提供する世界最大のクラウドサービスのことです。
クラウドサービスとは、ネットワーク上にあるさまざまなサービスを必要に応じて利用するシステム形態のことです。
S3はクラウド上でストレージを提供するサービスである
今回はAWSでもっとも手軽にWebサイトを構築できる「Amazon S3」を利用しました。
Amazon S3（Amazon Simple Storage Service）は、クラウド上でファイルを共有できるAWSの中のひとつのサービスです。Webサイトのコンテンツ配信やバックアップなどに使用できます。
S3は静的なページのみ対応しており、PHPなど動的なページには対応していません。
AWS基本用語
- バケットとは、データの入れ物のことです。
- オブジェクトとは、バケットに保存するファイルのことです。
全体の流れ
- AWSのアカウントを取得する。
- HTMLファイルを作る。
- バケットを作成して、HTMLファイルをAWS上に保存して、公開する。
- 独自ドメインを設定する。
- http://www.hogehoge.com にアクセスしたら、http://hogehoge.com にリダイレクトさせる。
1. AWSのアカウントを取得する
アカウント登録にはメールアドレスとクレジットカード、本人確認のための電話番号が必要です。AWSのサイトにアクセスします。
https://aws.amazon.com/jp/
AWSのアカウントは、Amazonで買い物するときのアカウントと異なります。Amazonの買い物アカウントを持っていても、ここでアカウントを新規作成します。
アドレス項目は必須です。日本語に対応していないので、英語で住所を入力します。
クレジットカード情報を入力します。
電話番号を入力します。
電話がかかってくるので、電話で認証番号を入力します。
無償は「ベーシックプラン」です。ベーシックプランを選びます。
2. HTMLファイルを作る
メモ帳を開いて、以下を入力します。ファイル名を「index.html」として、文字コードを「UTF-8」で保存します。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
Hello World
</body>
</html>
3. バケットを作成して、HTMLファイルをAWS上に保存する
AWSにログインし、「すべてのサービス」から、「S3」を選択します。
「バケットを作成する」をクリックし、バケット名を入力します。リージョンは「アジアパシフィック（東京）」を選択し、「次へ」をクリックします。
「プロパティの設定」画面では、何もせず、「次へ」をクリックします。
「アクセス許可の設定」画面では、「パブリックアクセスを管理する」の項目を「このバケットにパブリック読み取りアクセス権限を付与する」を選びます。
「確認」画面では、「バケットを作成」をクリックします。
S3のコンソール画面に戻るとバケットが作成されています。バケット名をクリックします。
「ファイルの選択」画面で、「ファイルを追加」をクリックし、さきほど作った「index.html」を選びます。
アップロードしたあとに、「次へ」をクリックします。
「アクセス許可を設定する」画面では、「パブリックアクセス許可を管理する」の項目で「このオブジェクトにパブリック読み取りアクセス権限を付与する」を選びます。
「プロパティを設定する」画面では、何も変更せずに、「次へ」をクリックします。
「確認画面」では、「アップロード」をクリックします。
ファイルがアップロードされました。さきほどアップロードした「index.html」をクリックします。
「リンク」にある「https://s3-ap～」で始まるURLをクリックします。
「Hello World」が表示されました。
5. 独自ドメインを設定する
「Amazon Route 53」にアクセスします。
「Amazon Route 53」とは、AwSのクラウドドメインネームシステム（DNS）の名称です。
クラウドドメインネームシステム（DNS）とは、インターネット上におけるドメイン名などを管理・運用するシステムのことです。
https://console.aws.amazon.com/route53
「DNS Management」の「Get Started now」をクリックします。
もう一度、「Create Hosted Zone」をクリックします。
「Domain Name」に取得済みのドメイン「hogehoge.com」を入力します。今回は、メインをwwwなしの「hogehoge.com」にして、「www.hogehoge.com」にアクセスされた場合、「hogehoge.com」にリダイレクトするように設定します。
「Public Hosted Zone」を選択し、「Create」をクリックします。
「NS」の「Value」をメモしておきます。
次にオリジナルドメインを購入したサイトに移動し、ネームサーバー設定画面を開きます。ムームードメインの場合、「ネームサーバ設定変更」という名称です。
ネームサーバー1～4に先ほどメモした「ns-」で始まるValueに記載されているドメイン名を入力します。最後のドットは入力してはいけません。入力後、「ネームサーバ設定変更」をクリックします。
AWSに戻り、「プロパティ」の「Static website hosting」をクリックします。「エンドポイント」に記載されているURLをコピーします。
「Amazon Route 53」に移動します。「Name」に「www」、「Type」は「CNAME - Canonical name」を選択し、「Value」に先ほどコピーしたURLを貼り付けます。「Create」をクリックします。
以下のように、wwwで始まるCNAMEが追加されます。移行には1日程度かかります。翌日、独自ドメインにアクセスすると、「Hello World」が表示されます。
5. http://www.hogehoge.com にアクセスしたら、http://hogehoge.com にリダイレクトさせる
AWSで、wwwで始まるドメイン名でバケットを新規作成します。「アクセス」は今まで同様に「パブリック」に設定します。
wwwで始まるドメイン名の「プロパティ」を開き、「Static website hosting」で「リクエストをリダイレクトにする」を選択します。「ターゲットドメインまたはドメイン」の項目に、wwwなしのドメインを入力し、「保存」をクリックします。この処理はすぐに反映されます。www.hogehoge.comにアクセスすると、hogehoge.comにリダイレクトされます。
