JAWS-‐UG 東海道 2014 - Amazon Web Services

JAWS-‐UG 東海道 2014
フロントエンジニア向けAWS初級ハンズオン!
!
クラウドデザインパターンを使って、!
画像配信サイトを高速化してみよう
‹#›
1
⾃自⼰己紹介
❖ 名前 ❖堀内康弘 ❖ 所属/職種 ❖ アマゾンデータサービスジャパン ❖ テクニカルエバンジェリスト ❖ ID ❖@horiuchi !
❖ 好きなAWSサービス ❖Amazon RDSを中⼼心に全サービス
2
AWS クラウドデザインパターンとは
“AWSクラウドを利利⽤用する際に発⽣生する、典型的な問題と
それに対する解決策・設計⽅方法について、先⼈人たちの知
恵を分かりやすく分類して、ノウハウとして利利⽤用できる
ように整理理したもの”
-‐ Ninja of Three -‐
3
Wikiでパターンを公開中
❖ https://www.facebook.com/awscdp ❖Facebookを「CDP」で検索索 ❖ http://aws.clouddesignpattern.org ❖「クラウドデザインパターン」で検索索
4
❖
5
CDPシナリオ[画像動画配信サイト]
シナリオの説明
❖雲の写真を載せるブログサイト開始 ❖はじめは個⼈人的でスモールスタート
6
シナリオの説明
❖動画、過去画像集を公開 ❖サイズが⼤大きく、ダウンロード負荷の⾼高い
コンテンツの配信 ❖コンテンツ容量量増が問題に
7
シナリオの説明
❖ 雲マニア御⽤用達のサイトへ ❖ Facebookから⽕火がつく ❖ アクセス増により、アクセス出来ない状況に
イワシ雲！
イワシ雲！
イワシ雲！
8
シナリオの説明
❖ 海外の雲マニアがサイトを発⾒見見 ❖ 海外有名ニュースサイトへの掲載が決定 ❖ 掲載までに海外からのアクセスへの対応が必要
9
パターン適⽤用遷移
⼤大⼈人気サイトへ -‐‑‒ Direct Hosting パターン
ZIP/動画配布 -‐‑‒ Web Storageパターン
海外配信 -‐‑‒ Chche Distパターン
10
今回のハンズオン
❖Direct Hostingパターン ❖Cache Distributionパターン
11
全てのシナリオ実装は・・
AWSクラウドデザインパターン
ＡＷＳ利利⽤用時の設計パターンを収録「実装ガイド」が発売中！
12
❖
ハンズオン
Direct Hostingパターン
13
ダイレクトホスティングパターン
❖ S3にhtmlファイルや画像などを配置し、EC2を使わず直接Webサイ
トをホスティングするパターン !
❖ ハンズオンの流流れ ❖
❖
❖
❖
❖
バケットの作成バケットの公開設定 Webサイトホスティング機能の有効化コンテンツアップロード Route53(DNSサーバ）の設定
http://aws.clouddesignpattern.org/index.php/CDP:Direct_Hosting
%E3%83%91%E3%82%BF%E3%83%BC%E3%83%B3
14
バケットの作成
❖Webサイトをホスティングするバケットを作成 ❖バケット名は「XXX.horiuchi.asia」にする
好きな文字列で
15
バケットの公開設定
❖バケットに⼊入れたコンテンツを⾃自動的に公開
設定にするために、バケットポリシーを設定
右クリック -‐>プロパティ
16
バケットの公開設定
❖JSON形式のポリシーを適⽤用
17
ポリシー
{ "Version": "2008-‐10-‐17", "Statement": [ { "Sid": "PublicReadGetObject", 作成したバケット名
"Effect": "Allow", と "Principal": { "AWS": "*" 合わせる
}, "Action": "s3:GetObject", "Resource": “arn:aws:s3:::yasuhiro.horiuchi.asia/*” } ] }
サンプルファイル： https://s3-‐ap-‐northeast-‐1.amazonaws.com/adsj-‐handson/cdp-‐content/bucket-‐policy.txt 18
Webサイトホスティング機能の有効化
❖ Webサイト機能をonすることで、Indexドキュメ
ントやエラードキュメントの設定が可能に
右クリック -‐>プロパティ
チェック
Index.htmlを
入力
19
コンテンツアップロード
❖サンプルコンテンツをダウンロード ❖http://adsj-‐‑‒handson.s3.amazonaws.com/cdp-‐‑‒content/contents.zip
❖バケットを選択して、Actions-‐‑‒>Upload
20
コンテンツアップロード
❖「Add Files」で、展開したzipファイルの
中⾝身を全て選択してStart Uploadを選択
21
ここで⼀一旦テスト
ここのＵＲＬ
にアクセス
なお、このEndpointはあとの手順で使用するので、メモしておいてください。
22
Route53(DNSサーバ）の設定
❖今回のハンズオンでは、ホスト名をお貸し出しします ❖以下ログインURLおよびアカウントでログインして作
業を⾏行行なって下さい ❖ https://horiuchi.signin.aws.amazon.com/console
❖User Name: jaws-‐‑‒tokaido ❖Password: Tokaido2014!
23
！注意点！
❖ 元のアカウントで再ログインする場合は、以
下のリンクをクリックして下さい。
24
Route53(DNSサーバ）の設定
❖サービス⼀一覧からRoute53を選択 ❖「horiuchi.asia」にチェックを⼊入れて、
「Go to Record Sets」をクリック
25
レコードセットの作成
バケット名の.horiuchi.asia
を省いた部分を入力
クリック
TTLを60秒に
テストを行なった時の
Endpointを設定
26
アクセス
❖ nslookup XXXXX.horiuchi.asiaでレコートが登録できている
か確認 ❖http://XXXXX.horiuchi.asiaにアクセス ❖ 正しくサイトが表⽰示されていることを確認
27
❖
ハンズオン
Cache Distributionパターン
28
Cache Distributionパターン
❖ S3やEC2の前にCloudFrontを配置することで、世界中に⾼高速にコ
ンテンツを配信するパターン !
❖ ハンズオンの流流れ ❖ CloudFrontディストリビューションの設定 ❖ オリジンサーバ（S3バケット）の設定 ❖ CNAME(XXXX.horiuchi.asia）を設定 ❖ Route53(DNSサーバ）の設定 ❖ DNSのCNAMEレコードをCloudFrontに付け替え
http://aws.clouddesignpattern.org/index.php/CDP:Cache_Distribution
%E3%83%91%E3%82%BF%E3%83%BC%E3%83%B3
29
CloudFrontディストリビューションの設定
❖ Route53を操作していたアカウントをログアウトさ
せ、ご⾃自⾝身のアカウントで再度度ログインして下さい ❖ ログイン後、ServicesからCloudFrontを選択します
30
CloudFrontディストリビューションの設定
❖ CloudFrontの画⾯面から、CreateDistributionを選択
31
CloudFrontディストリビューションの設定
❖Downloadを選択してContinue
32
CloudFrontディストリビューションの設定
❖ Origin Domain Nameに、S3のWebSiteエンド
ポイントを設定（P28でDNSに設定した内容）
下のほうにある Create Distributionボタンをクリック
33
CloudFrontディストリビューションの設定
❖ 作成したDistributionに
チェックをいれて、
DistributionSettingsを
クリック ❖ Domain Nameにある
DNS名をコピー ❖ コピー後Editボタンを
クリック
34
CloudFrontディストリビューションの設定
❖Alternate Domain Namesに、
XXXXX.horiuchi.asiaを設定
下のほうにある Yes,Editボタンをクリック
35
CloudFrontディストリビューションの設定
❖StatusがInProgressからDeployedになる
まで待つ
36
Route53(DNSサーバ）の設定
❖以下ログインURLおよびアカウントでログインし
て作業を⾏行行なって下さい ❖ https://horiuchi.signin.aws.amazon.com/console ❖User Name: jaws-‐‑‒tokaido ❖Password: Tokaido2014!
37
Route53(DNSサーバ）の設定
❖ ServicesからRoute53を選択 ❖ 「horiuchi.asia」にチェックをつけてGo to Record Setsをクリック
38
Route53(DNSサーバ）の設定
❖ 設定済みCNAMEレコードのvalue値を、
CloudFrontのDNS名に変更更
39
Route53(DNSサーバ）の設定
❖ nslookupで、CloudFrontのDNS名が設定されて
いるか確認 ❖ ブラウザからXXXX.horiuchi.asiaでアクセスし
て確認
40
お疲れ様でした
以下の順序で、AWSで作業した環境の⽚片付けをおねがいしますそのままにしておくと課⾦金金が発⽣生します !
1. S3バケット ❖ バケット右クリック-‐‑‒>削除 2. CloudFront ディストリビューション ❖ 右クリック-‐‑‒>削除 3. EC2 ❖ 右クリック-‐‑‒>Terminate
❖ EBSが残っていないことを確認 !
Security Group, Key Pairは無料料ですので、引き続きお使いください
41
❖
42
CDPでAWSをもっと楽しく

Download Report