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クラウドデザインパターン
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
ここで⼀一旦テスト
ここのURL
にアクセス
なお、この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をもっと楽しく