現在のプロジェクトで静的ファイルをAWSのAmazon S3(以下 S3)にホスティングして運用しているので、
自分でも動かしてみました。
思いのほか低コストでできたので、手順をまとめてみました。
LPやポートフォリオなどの静的ファイルのホスティング先をどうするか迷っている人の参考になればと思います。
基本的にストレージを提供するサービスになっています。
ストレージとは画像、動画、ファイルなど様々なデータを保存できるもので、例えば、iCloudは写真や書類(メモアプリ、pdfなど)を保存するクラウドストレージサービスです。
S3は、他のAWSサービスと連携して使うことができ、Amazon EC2のスナップショット(バックアップ)の保存や、ファイルアップロード時をイベントトリガーとしてLambda関数を呼び出しをしたりと、様々な使い方ができます。
今回は、静的ホスティング機能について記載していこうと思います。
参照:S3ユースケース
静的なwebサイトをホスティング(一般公開)すること。
静的なwebサイトとはhtmlファイルをサーバにアップロードしておき、リクエストに対してそのままそのファイルをレスポンスするサイトのこと。
例えば、PHPやJavaはアプリケーションサーバで動作させることにより、ログイン情報によって処理を行うことができるためリクエストごとに異なったレスポンスをするので、動的なwebサイトになります。
S3はアプリケーションサーバではないため、このような動的サービス(WordPressなどのCMS)のホスティングはできないです。
1番の理由はコストが低いです。
料金は、容量・リクエスト数・データ転送によって決まります。
一般的なストレージクラスの`S3 Standardですと、
容量が2.58円/GB。
1,000リクエスト(GETの場合)あたり0.038円。
データ転送(S3 からインターネット)が9.3円/GB(1GB/月まで無料)。
仮に1ヶ月運用した下記の条件で運用した場合、約80円/月になります。レンタルサーバを借りてLPなどを運用するよりはるかに安いです。
【条件】
・トップページの容量 800KB
・ページのアクセス月10,000アクセス(1リクエストあたり10GETとする)
【計算式】
月額 = 容量 + リクエスト数 + データ転送
78.2円= 約0円 + ((10000×10/1000)×0.038) + (10000×0.0008×9.3)
また、 フルマネージドサービスなのでサーバのメンテナンス等は考えなくても良いです。
参照:料金 - AWS S3
公開するhtmlファイルを準備
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>S3静的ホスティング</title>
</head>
<body>
<h1>S3静的ホスティング</h1>
</body>
</html>
AWSコンソールにログイン後、Amazon S3サービスに移動バケットを作成するを押下し、バケット名を入力してバケットを作成
作成したバケットに移動しアップロードを押下して、先程のhtmlファイルをアップロード
アップロードしたindex.htmlをクリックし、「プロパティ」タブの「Static website hosting」項目の
「このバケットを使用してウェブサイトをホストする」を選択。
インデックスドキュメントに静的ホスティングするindex.htmlを入力して保存
バケットに戻り、index.htmlを選択してからアクションボタンを押下し、公開するをクリック
※バケット作成時に「パブリックアクセスをすべてブロック」を選択していた場合、
「公開」ボタンが非活性になっているので、その場合は「アクセス権限」タブの「ブロックパブリックアクセス」項目の「パブリックアクセスをすべてブロック」のチェックを外す
「プロパティ」タブの「Static website hosting」項目のエンドポイントからアクセス可能
表示を確認できました!
S3を利用することで簡単に静的ホスティングできます。
Amazon Route 53を使えば、独自ドメインも使うので近いうちに試してみたいと思います。
自己紹介ページやLPページを公開したい方はぜひお試しください!!