Slide 1

Slide 1 text

© 2024, Amazon Web Services, Inc. or its affiliates. © 2024, Amazon Web Services, Inc. or its affiliates. 篙 直矢(Funazashi Naoya) パブリックセクター 技術統括本部 ソリューションアーキテクト LLM勉強会様向け サーバレスンハンズオン

Slide 2

Slide 2 text

© 2024, Amazon Web Services, Inc. or its affiliates. 自己紹介 名前: 篙 直矢 (Funazashi Naoya) 所属: アマゾンウェブサービスジャパン合同会社 パブリックセクター 技術統括本部 ソリューションアーキテクト 経歴: 日系損保システム子会社にてアプリケーション・インフラ開発/運用と幅広い業務に従事 また、CCoEとしてAWSの活用推進およびAWSへのマイグレーション/環境構築/運用を実施 現在は、大学などの教育機関・研究機関・医療・NPOPCO団体のお客様の技術支援を担当 好きなAWSサービス: Amazon VPC、Amazon Service Catalog、AWS Lambda 2

Slide 3

Slide 3 text

© 2023, Amazon Web Services, Inc. or its affiliates. All rights reserved. Amazon Confidential and Trademark. 本日のWorkshopのゴール 3 • サーバレスな環境で稼働するSingle Page Applicationを実行するための以下のAWSサービス について実際に手を動かして動作や設定内容についてイメージできるようになる • Amazon CloudFront (CDN) • Amazon S3(静的コンテンツ置き場とCDN経由での配布) • Amazon API Gateway (API実行のエンドポイント) • AWS Lambda (処理の実行)

Slide 4

Slide 4 text

© 2022, Amazon Web Services, Inc. or its affiliates. 事前準備 • 以下のコンテンツを予めダウンロードしておいてください ▪ ハンズオンで利用するコンテンツファイル群 – https://pages.awscloud.com/rs/112-TZM-766/images/JAPAN_FIELD_WEBINAR_Hands-on-for-Beginners- CF_WAF_2021.zip 4

Slide 5

Slide 5 text

© 2022, Amazon Web Services, Inc. or its affiliates. 凡例 5 • 画面キャプチャを用いて操作や確認を補足しています ▪ 赤実線は「入力/クリックする箇所」を示します ▪ 赤点線は「表示内容を確認する箇所」を示します ▪ 青矢印は「画面の遷移」を示します

Slide 6

Slide 6 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. サーバレス ハンズオン その1 6

Slide 7

Slide 7 text

© 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その1 • 本セクションでの作成範囲 ▪ S3に静的コンテンツを格納 ▪ 上記を配信するディストリビューションを作成(現時点ではキャッシュは無効化) 7

Slide 8

Slide 8 text

© 2022, Amazon Web Services, Inc. or its affiliates. ちょっと解説: AWSマネジメントコンソール • ナビゲーションバーから各種サービスを選択して利用できる • サービスに応じた機能がサイドメニューに表示され、利用する機能を選択できる 8 ナビゲーションバー サイドメニュー ホーム画面に戻る サービス一覧 を表示 検索 リージョンを選択 アカウントを選択 サイドメニューで選択した項目に対応した情報を表示

Slide 9

Slide 9 text

© 2022, Amazon Web Services, Inc. or its affiliates. ちょっと解説: AWSリソースへのアクセス方法 • AWSのサービスを利用する手段は大きく3つあり、それぞれ利点が異なる。 いずれを選んだ場合にも、最終的にはAWSサービスのWebAPIを経由して実行される。 ▪ AWS マネジメントコンソール(マネコン):GUIベースで対話的に設定・利用が可能 ▪ AWS Command Line Interface(CLI):CUIベースで利用が可能であり再現が容易 ▪ AWS SDK:各種プログラミング言語(Python,Javaなど)で提供されており自動化が容易 9 Web API AWS Command Line Interface (AWS CLI) AWS SDKs AWS Management Console

Slide 10

Slide 10 text

© 2022, Amazon Web Services, Inc. or its affiliates. S3バケットの作成 • S3を選択 ▪ マネジメントコンソールから「s3」をクリック – 検索窓部分に「s3」と入力することで選択できます 10

Slide 11

Slide 11 text

© 2022, Amazon Web Services, Inc. or its affiliates. S3バケットの作成 • バケットを作成 ▪ 「バケットを作成」をクリック ▪ バケット名に「yymmdd-cfr-handson」などのユニークな名称を入力 – yymmddは日付、,nは任意数字を入れて、世界唯一な名称となるようにしてください ▪ AWSリージョンは「オレゴン(us-west-2)」を選択 ▪ その他設定は変更せず、画面をスクロールして「バケットを作成」をクリック 11

Slide 12

Slide 12 text

© 2022, Amazon Web Services, Inc. or its affiliates. S3への静的コンテンツのアップロード • S3のメニューから、作成したバケット名をクリック • 「オブジェクト」セルに、ダウンロード済みの「forS3」内のコンテンツ(staticフォルダと index.htmlファイル)をドラッグ ▪ 以下の図のように4つのファイルがプレビューされればOKです • 「アップロード」をクリック 12

Slide 13

Slide 13 text

© 2022, Amazon Web Services, Inc. or its affiliates. ちょっと解説: リージョンとアベイラビリティゾーン 13 リージョン アベイラビリティー ゾーン(AZ) データセンター すべてのリージョンは物理的に離れた場所にある 複数のアベイラビリティーゾーンで構成されています アベイラビリティーゾーンは1つ以上のデータセンターで 構成され、互いに低遅延な専用線で接続されています 複数のアベイラビリティーゾーン(AZ)でシステムを構成 することで、高い耐障害性を実現できます Point of Presence(PoP) 世界中で400箇所以上に配置された Point of Presence からの低レイテンシーな高速転送で 世界中のユーザーにコンテンツを安全に配信できます 現時点でのリージョン、AZ、POPの総数:https://aws.amazon.com/jp/about-aws/global-infrastructure/?hp=tile&tile=map

Slide 14

Slide 14 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontディストリビューションの作成 • CloudFrontを選択 ▪ マネジメントコンソールから「 CloudFront 」をクリック – 検索窓部分に「cloudfr」と入力することで選択できます(補完検索されます) 14

Slide 15

Slide 15 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontディストリビューションの作成 • 左のハンバーガーボタンを押して「ディストリビューション」を選択 • 「ディストリビューションを作成」をクリック 15

Slide 16

Slide 16 text

© 2022, Amazon Web Services, Inc. or its affiliates. オリジンの設定 • オリジンドメインをクリックし、「(作成したバケット名).s3.us-west-2.amazonaws.com」を選択 ▪ 先程作成したs3バケットをオリジンドメインとして指定します • オリジンアクセスで「Origin access control settings (recommended)」を選択 • 登場したプルダウンで「Create new OAC」をクリックしポップアップ画面で「Create」を選択 16

Slide 17

Slide 17 text

© 2022, Amazon Web Services, Inc. or its affiliates. ビヘイビアの設定 • ビューワープロトコルポリシーに「Redirect HTTP to HTTPS」を選択 ▪ httpでアクセスしてもhttps接続されるようになります • キャッシュポリシーで「CachingDisabled」を選択 ▪ CDNの効果を体感するため、あえて最初は無効化しています 17

Slide 18

Slide 18 text

© 2022, Amazon Web Services, Inc. or its affiliates. ディストリビューションの設定 • ウェブアプリケーションファイアウォール(WAF)で「セキュリティ 保護を有効にしないでください」を選択 • デフォルトルートオブジェクトに「index.html」を入力する • 「ディストリビューションを作成」をクリック 18

Slide 19

Slide 19 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontにS3バケットのアクセスを許可する 19 • CloudFrontのディストリビューション作成上部の「ポリシーをコピー」を選択 • 先ほど作成したS3バケットを開き、「アクセス許可」のタブからバケットポリシーの「編集」ボ タンを選択する

Slide 20

Slide 20 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontにS3バケットのアクセスを許可する 20 • CloudFrontの画面でコピーしたポリシーを貼り付けて「変更の保存」を選択する。

Slide 21

Slide 21 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFront経由でのコンテンツ表示 • 最終変更日が「デプロイ」から変化するまで待つ • ディストリビューションドメイン名をコピーしてブラウザ(Chrome)で表示する 21

Slide 22

Slide 22 text

© 2022, Amazon Web Services, Inc. or its affiliates. 静的コンテンツの表示の確認(キャッシュなしでの配信) • Chromeのメニューから「その他のツール>デベロッパーツール」を選択 22

Slide 23

Slide 23 text

© 2022, Amazon Web Services, Inc. or its affiliates. 静的コンテンツの表示の確認(キャッシュなしでの配信) • 「Network」タブで「Disable cache」にチェックを入れてリロードを実施 ▪ ブラウザ、Cloudfrontともキャッシュが効かないため、全描画に2sec程度かかる ▪ x-cacheヘッダには「Miss from cloudfront」と表示される 23

Slide 24

Slide 24 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その2 24

Slide 25

Slide 25 text

© 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その2 • 本セクションでの作成範囲 ▪ ディストリビューションにキャッシュポリシーを追加してコンテンツキャッシュを設定する 25

Slide 26

Slide 26 text

© 2022, Amazon Web Services, Inc. or its affiliates. キャッシュポリシーを作成 • CloudFrontのハンバーガーメニューを開き、「ポリシー」を選択 ▪ マネージドポリシーとカスタムポリシーが表示される。 マネージドポリシーには、先程使用した「CachingDisabled」が存在する • 「キャッシュポリシーを作成」をクリック 26

Slide 27

Slide 27 text

© 2022, Amazon Web Services, Inc. or its affiliates. キャッシュポリシーを作成 • 名前に「handson-cachepolicy」を入力 • 設定値は変更しない ▪ デフォルトTTL=86400sec (24時間)となる • 「作成」をクリック 27

Slide 28

Slide 28 text

© 2022, Amazon Web Services, Inc. or its affiliates. ディストリビューションにビヘイビアを追加 • CloudFrontメニューの「ディストリビューション」を選び、ディストリビューションを選択 • 「ビヘイビア」タブを選び、「ビヘイビアを作成」をクリック 28

Slide 29

Slide 29 text

© 2022, Amazon Web Services, Inc. or its affiliates. 追加するビヘイビアの設定 • パスパターンに「static/*」を指定 • オリジンとオリジングループに「(作成したバケット名).s3.us-west-2.amazonaws.com」を指定 • ビューワープロトコルポリシーに「Redirect HTTP to HTTPS」を指定 • キャッシュポリシーに「handson-cachepolicy」を指定 • 「ビヘイビアを作成」をクリック 29

Slide 30

Slide 30 text

© 2022, Amazon Web Services, Inc. or its affiliates. ディストリビューションの確認 • ここまでの設定で、「static/*」以下についてはキャッシュが有効化される 30

Slide 31

Slide 31 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFront経由でのコンテンツ表示 • 最終変更日が「デプロイ」から変化するまで待つ • ディストリビューションドメイン名をコピーしてブラウザ(Chrome)で表示する ▪ 前回との違いを確認するため、新規タブで表示する 31

Slide 32

Slide 32 text

© 2022, Amazon Web Services, Inc. or its affiliates. 静的コンテンツの表示の確認(キャッシュありでの配信) • 同様にデベロッパツールを開いた状態で、リロードを何回か実施する ▪ コンテンツファイル群の取得が短縮され、全体で1秒程度で表示できるようになっている ▪ css,js,pngファイルのx-cacheヘッダには「Hit from cloudfront」と表示される 32

Slide 33

Slide 33 text

© 2022, Amazon Web Services, Inc. or its affiliates. 静的コンテンツの表示の確認(未実装部分のエラー確認) • 表示コンテンツのInput Message欄に「こんにちは世界」と入力し「Send」をクリック ▪ Output Messageにエラーレスポンスが表示される ▪ Index.html内から無効なWebAPIを呼び出しているためであり、次ステップで解決させる 33

Slide 34

Slide 34 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その3 34

Slide 35

Slide 35 text

© 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その3 • 本セクションでの作成範囲 ▪ Amazon API GatewayとAWS Lambdaを用いたWebAPIを実装する ▪ ハンズオンではLambda利用によるサーバレス実装としているが、EC2やオンプレWebサーバでもよい 35

Slide 36

Slide 36 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の作成 • Lambdaを選択 ▪ マネジメントコンソールから「Lambda」をクリック – 検索窓部分に「lam」と入力することで選択できます 36

Slide 37

Slide 37 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の作成 • リージョンを「オレゴン(us-west-2)」に設定 • 「関数の作成」をクリック 37

Slide 38

Slide 38 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の作成 • 「一から作成」を選択 • 関数名に「handson-lambda」と入力 • ランタイムに「Python 3.12」を指定 • 「関数の作成」をクリック 38

Slide 39

Slide 39 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の実装 • 「コードソース」画面から「lambda_function.py」をダブルクリックしてソースを表示 • コード内容を、ダウンロード済みの「cloudfront-handson-lambda.py」の内容で書き換える • 「Deploy」をクリック 39

Slide 40

Slide 40 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数に付与する権限(IAMロール)の修正 • 「設定」タブを選び、「アクセス権限」を選択する • 表示される「実行ロール」のロール名をクリックする ▪ 新しいタブで、このLambda関数に対しての権限情報(IAMロール)が表示される 40

Slide 41

Slide 41 text

© 2022, Amazon Web Services, Inc. or its affiliates. IAMロールへの新規IAMポリシーの追加 • 許可ポリシーの「許可を追加」を押し、「ポリシーをアタッチ」をクリック 41

Slide 42

Slide 42 text

© 2022, Amazon Web Services, Inc. or its affiliates. IAMロールへの新規IAMポリシーの追加 • その他の許可ポリシーの検索窓に「translate」と入力してEnterを押す ▪ 窓はクリアされるが、その下に「”translate”」と表示されてフィルタに反映される • 表示されたポリシー名の「TranslateReadOnly」のチェックボックスにチェックを入れる • 「ポリシーをアタッチ」をクリック ▪ TranslateReadOnlyポリシーは、Lambda内で利用しているAmazon Translateの翻訳サービス利用の権限 42

Slide 43

Slide 43 text

© 2022, Amazon Web Services, Inc. or its affiliates. ちょっと解説: IAMロール、ユーザ、ポリシー • AWSでの認証・認可の仕組みを「Identity and Access Management(IAM)」と呼ぶ ▪ 各ユーザの認証(Identity)を管理する仕組みが「IAM ユーザ」 ▪ 認可する権限を管理する仕組みが「IAM ポリシー」と「IAM ロール」 ▪ 各ユーザは割り当てられたポリシー or 引き受けたロールの範囲内での操作のみ許可される ▪ 各AWSリソースも引き受けたロールの範囲内での操作のみ許可される 43 IAM User IAM Role IAM Policy AWS Resource (例: EC2, Lambda, API Gateway… ) 割り当てる (Attach) 割り当てる (Attach) 引き受ける (Assume) 引き受ける (Assume)

Slide 44

Slide 44 text

© 2022, Amazon Web Services, Inc. or its affiliates. API Gatewayの作成 • API Gatewayを選択 ▪ マネジメントコンソールから「API Gateway」をクリック – 検索窓部分に「api」と入力することで選択できます 44

Slide 45

Slide 45 text

© 2022, Amazon Web Services, Inc. or its affiliates. Rest APIの作成 • リージョンが「オレゴン(us-west-2) 」であることを確認 • サイドメニューから「API」をクリック • 「REST API」の「構築」をクリック 45

Slide 46

Slide 46 text

© 2022, Amazon Web Services, Inc. or its affiliates. Rest APIの作成 • 「新しいAPIの作成」で「新しいAPI」を選択する • API名に「handson-api」と入力する • 「APIの作成」をクリックする 46

Slide 47

Slide 47 text

© 2022, Amazon Web Services, Inc. or its affiliates. APIのGETメソッドとしてLambda関数を紐付ける • 画面右下「メソッドの作成」をクリック 47

Slide 48

Slide 48 text

© 2022, Amazon Web Services, Inc. or its affiliates. APIのGETメソッドとしてLambda関数を紐付ける 48 • メソッドタイプで「GET」を選択 • 「Lambdaプロキシ結合の使用」を選択 • リージョンは「us-west-2」を選択する • Lambda関数に「handson-lambda」と入力し 補完された内容を選択する • 上記を選択したが画面下部のメソッドの作成を 選択する

Slide 49

Slide 49 text

© 2022, Amazon Web Services, Inc. or its affiliates. APIのGETメソッドとしてLambda関数を紐付ける • GETの「メソッドリクエスト」をクリックし、画面下部の編集ボタンを選択する 49

Slide 50

Slide 50 text

© 2022, Amazon Web Services, Inc. or its affiliates. APIのGETメソッドとしてLambda関数を紐付ける • URLクエリ文字列パラメータのトグル内にある、 「クエリ文字列の追加」をクリック • 名前に「input_text」と入力 • 右側のチェックボタン(必須)をクリックし保存 50

Slide 51

Slide 51 text

© 2022, Amazon Web Services, Inc. or its affiliates. 作成したRest APIをデプロイする • API Gatewayのリソース画面から「APIのデプロイ」をクリック • 表示されるダイアログで以下を実施 ▪ デプロイされるステージで「[新しいステージ]」を選択 ▪ ステージ名に「api」を入力 ▪ 「デプロイ」をクリック 51

Slide 52

Slide 52 text

© 2022, Amazon Web Services, Inc. or its affiliates. デプロイしたAPIへの呼び出しを試してみる • 「URLの呼び出す」のURLをコピーして表示する ▪ 新しいタブで接続されるが、「Internal server error」となる。 – クエリ文字列(input_text)を未指定で呼び出したため • URL末尾に以下のクエリ文字列を追加して表示 ▪ ?input_text=こんにちは世界 ▪ 画面には翻訳結果の「Hello world」が表示される ▪ 他の日本語でも試してみてください 52

Slide 53

Slide 53 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その4 53

Slide 54

Slide 54 text

© 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その4 • 本セクションでの作成範囲 ▪ 作成したAPIをCloudFrontに紐付ける 54

Slide 55

Slide 55 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontの編集 • CloudFrontを選択 ▪ マネジメントコンソールから「 CloudFront 」をクリック – 検索窓部分に「cloudfr」と入力することで選択できます(補完検索されます) 55

Slide 56

Slide 56 text

© 2022, Amazon Web Services, Inc. or its affiliates. オリジンリクエストポリシーの作成 • サイドメニューから「ポリシー」を選ぶ • タブメニューから「オリジンリクエスト」を選ぶ • カスタムポリシーの「オリジンリクエストポリシーを作成」をクリック 56

Slide 57

Slide 57 text

© 2022, Amazon Web Services, Inc. or its affiliates. オリジンリクエストポリシーの作成 • 名前に「handson-originrequestpolicy」を入力 • クエリ文字列で「指定したクエリ文字列を含める」を選択 • 表示されたプルダウンの「許可」に「input_text」を入力 • 「作成」をクリック 57

Slide 58

Slide 58 text

© 2022, Amazon Web Services, Inc. or its affiliates. オリジンの追加 • サイドメニューから「ディストリビューション」をクリック • 作成したディストリビューションのIDをクリック • 「オリジン」タブを選択 • 「オリジンを作成」をクリック 58

Slide 59

Slide 59 text

© 2022, Amazon Web Services, Inc. or its affiliates. オリジンの追加 • 「オリジナルドメイン」に、APIGatewayで作成したAPIのドメイン名を入力 ▪ 「xxxxxxxxxx.execute-api.us-west-2.amazonaws.com」となる。(”https://”,”/api”は含まない) • プロトコルに「HTTPSのみ」を指定 • 「オリジンを作成」をクリック 59

Slide 60

Slide 60 text

© 2022, Amazon Web Services, Inc. or its affiliates. ビヘイビアの追加 • 「ビヘイビア」タブを選ぶ • 「ビヘイビアを作成」をクリック 60

Slide 61

Slide 61 text

© 2022, Amazon Web Services, Inc. or its affiliates. ビヘイビアの追加 • パスパターンに「api」を指定 ▪ 今回のREST APIのステージ名と対応している • オリジンに 「APIGatewayで作成したAPIのドメイン名」を指定 • ビューワープロトコルポリシーに 「Redirect HTTP to HTTPS」を指定 • キャッシュポリシーに 「CachingDisabled」を指定 ▪ REST APIの結果はクエリによって変化するため、非キャッシュ • オリジンリクエストポリシーに 「handson-originrequestpolicy」を指定 ▪ 今回はクエリ文字列input_textを連携するため指定している • 「ビヘイビアを作成」をクリック 61

Slide 62

Slide 62 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFront経由でのコンテンツ表示 • 最終変更日が「デプロイ」から変化するまで待つ • ディストリビューションドメイン名をコピーしてブラウザ(Chrome)で表示する ▪ 前回との違いを確認するため、新規タブで表示する 62

Slide 63

Slide 63 text

© 2022, Amazon Web Services, Inc. or its affiliates. 静的/動的コンテンツの表示の確認 • 前回同様、デベロッパーツールを開いて表示する ▪ 静的コンテンツはキャッシュされるため、リロード速度は速いまま ▪ UI入力に基づいてRest APIを呼び出して翻訳が実行される。 API処理は非キャッシュに設定しているため、入力テキストを変更すると動的に結果が変化する。 63

Slide 64

Slide 64 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオン その5 64

Slide 65

Slide 65 text

© 2022, Amazon Web Services, Inc. or its affiliates. サーバレスハンズオンその5 AmazonBedrockと連携してみる • 本セクションでの作成範囲 ▪ ここまでで作成したアプリケーションを改造してAmazon Bedrockのレスポンスを返すように修正する ▪ Amazon BedrockはAPIを通して基盤モデルにアクセスし利用することができるサービス 65 Amazon Bedrock

Slide 66

Slide 66 text

© 2024, Amazon Web Services, Inc. or its affiliates. All rights reserved. Amazon Confidential and Trademark. 最も簡単に 生成AI アプリケーションを 構築、拡張できる方法 基盤モデルを活用 Amazon Bedrock API を介して基盤モデルを利用することで 生成 AI アプリケーションの開発を加速 インフラの管理は不要 お客様の業務用途に適した基盤モデルを選択 Amazon、AI21 Labs、 Anthropic(アンソロピック)、 Cohere(コヒア)、Meta、Stability AI 自社データを使用して 基盤モデルを非公開でカスタマイズ

Slide 67

Slide 67 text

© 2022, Amazon Web Services, Inc. or its affiliates. Bedrockのモデルアクセスをリクエストする 67 • Bedrockを選択 ▪ マネジメントコンソールから「 Bedrock 」をクリック – 検索窓部分に「Bedrock」と入力することで選択できます(補完検索されます)

Slide 68

Slide 68 text

© 2022, Amazon Web Services, Inc. or its affiliates. Bedrockのモデルアクセスをリクエストする 68 • オレゴン(us-west-2)リージョンを選択していることを確認 • 画面左下部のモデルアクセスを選択する

Slide 69

Slide 69 text

© 2022, Amazon Web Services, Inc. or its affiliates. Bedrockのモデルアクセスをリクエストする 69 • 「モデルアクセスを管理」をクリック

Slide 70

Slide 70 text

© 2022, Amazon Web Services, Inc. or its affiliates. Bedrockのモデルアクセスをリクエストする 70 • 画面中断にあるAnthoropicのClaudeのチェックボックスにチェックを入れ、画面下部の「変更を 保存」をクリックする

Slide 71

Slide 71 text

© 2022, Amazon Web Services, Inc. or its affiliates. Bedrockのモデルアクセスをリクエストする 71 • AnthoropicのClaudeが、以下のようにアクセスが付与されましたというメッセージが表示される ことを確認する

Slide 72

Slide 72 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の修正 • Lambdaを選択 ▪ マネジメントコンソールから「Lambda」をクリック – 検索窓部分に「lam」と入力することで選択できます 72

Slide 73

Slide 73 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の作成 • リージョンを「オレゴン(us-west-2)」に設定 • 作成済みの「handson-lambda」をクリック 73

Slide 74

Slide 74 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数の実装 • 「コードソース」画面から「lambda_function.py」をダブルクリックしてソースを表示 • コード内容を、本スライド右の内容で置き換える • 「Deploy」をクリック 74 import boto3 import json bedrock_runtime = boto3.client( service_name='bedrock-runtime', region_name='us-west-2' ) def lambda_handler(event, context): modelId = 'anthropic.claude-v2' accept = 'application/json' contentType = 'application/json' input_text = event['queryStringParameters']['input_text'] prompt = "Human:" + input_text + "?¥nAssistant:" body = json.dumps({"prompt": prompt, "max_tokens_to_sample": 200}) result = bedrock_runtime.invoke_model( body=body, modelId=modelId, accept=accept, contentType=contentType ) body = result['body'].readlines() completion = json.loads(body[0].decode('utf-8'))['completion'] return { 'statusCode': 200, 'body': completion }

Slide 75

Slide 75 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数に付与する権限(IAMロール)の修正 • 「設定」タブを選び、「アクセス権限」を選択する • 表示される「実行ロール」のロール名をクリックする ▪ 新しいタブで、このLambda関数に対しての権限情報(IAMロール)が表示される 75

Slide 76

Slide 76 text

© 2022, Amazon Web Services, Inc. or its affiliates. IAMロールへの新規IAMポリシーの追加 • 許可ポリシーの「許可を追加」を押し、「ポリシーをアタッチ」をクリック 76

Slide 77

Slide 77 text

© 2022, Amazon Web Services, Inc. or its affiliates. IAMロールへの新規IAMポリシーの追加 • その他の許可ポリシーの検索窓に「bedro」と入力する • 表示されたポリシー名の「AmazonBedrockFullAccess」のチェックボックスにチェックを入れる *1 • 「許可を追加」をクリック 77 *1:今回はBedrockを利用するために強いFullAccessを利用していますが、実際の運用時には権限を絞ったカスタ ムロールを作成の上適応するようにしてください。

Slide 78

Slide 78 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数のタイムアウト時間の変更 • Lambda関数はデフォルトで3秒でタイムアウトしてしまう。今回のBedrockは3秒以上レスポンス にかかることが多く、実行時間を変更します。 • 「設定」タブを選び、「一般設定」を選択する • 表示されたら「編集」ボタンをクリックする 78

Slide 79

Slide 79 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数のタイムアウト時間の変更 • タイムアウトの項目を5分に設定し、保存をクリックする (なお、Lambdaの実行時間は15分が最大) 79

Slide 80

Slide 80 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambda関数のタイムアウト時間の変更 • タイムアウト時間が5分になっていることを確認します 80

Slide 81

Slide 81 text

© 2022, Amazon Web Services, Inc. or its affiliates. 動作の確認 • 表示コンテンツのInput Message欄に「AWSとはなんですか?」と入力し「Send」をクリック ▪ Output Messageにエラーレスポンスが表示される ▪ Bedrockからのレスポンスに時間がかかるため、先ほどまでの動作よりも時間がかかる 81

Slide 82

Slide 82 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. [オプション] AWS WAFのハンズオン 82

Slide 83

Slide 83 text

© 2022, Amazon Web Services, Inc. or its affiliates. WAFの作成 • AWS WAFを選択 ▪ マネジメントコンソールから「 WAF & Shield」をクリック – 検索窓部分に「waf」と入力することで選択できます(補完検索されます) 83

Slide 84

Slide 84 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontに紐付いたACLの作成 • 「Create web ACL」をクリック • Resource typeで「Cloudfront distributions」を選択 ▪ 選択するとUIが変化するので注意 • Nameに「handson-waf」と入力 ▪ CloudWatch metric nameも同名に反映される • Associated AWS resourcesで 「Add AWS resources」をクリック • 表示されたダイアログからCloudFrontを選択して 「Add」をクリック ▪ 選択したディストリビューションが画面反映される • 「Next」をクリック 84

Slide 85

Slide 85 text

© 2022, Amazon Web Services, Inc. or its affiliates. ACLに対してオリジナルルールを追加 • Rulesで「Add rules」を押し「Add my own rules and rule groups」を選択 • RuleのNameに「handson-rule」を入力 85

Slide 86

Slide 86 text

© 2022, Amazon Web Services, Inc. or its affiliates. ACLに対してオリジナルルールを追加 • StatementのInspectから「Originates from a country in」を選択 • Counry codesから「Japan - JP」を選択 • 「Add rule」をクリック ▪ 以上の設定により、以下のルールが設定される – Source IP Addressを元に日本からのアクセスと判断した場合、 アクセスを拒否(Block)する 86

Slide 87

Slide 87 text

© 2022, Amazon Web Services, Inc. or its affiliates. 複数ルールの優先順位を設定 • 現在適用されているルール一覧を確認する ▪ Default web ACL action ~ の部分でデフォルト挙動を指定できるが、今回はAllowのまま • Nextをクリックする • 複数ルールの優先順位確認の画面になるが、Nextをクリックする 87

Slide 88

Slide 88 text

© 2022, Amazon Web Services, Inc. or its affiliates. Web ACLの作成完了 • 監視メトリクスに関する設定画面になるが、今回は変更無しなので「Next」をクリック • 設定内容のレビュー画面になるので、入力を確認して画面右下の「Create web ACL」をクリック 88

Slide 89

Slide 89 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontへのWAFの反映を確認 • CloudFrontのコンソールから「ディストリビューション」を確認する ▪ 今回のWAF接続を反映中のため、最終変更日が「デプロイ」の表示となっている • デプロイが完了し、最終変更日に日時が表示されたらIDをクリックする 89

Slide 90

Slide 90 text

© 2022, Amazon Web Services, Inc. or its affiliates. CloudFrontへのWAFの反映を確認 • 画面上で「AWS WAF」にhandson-wafが反映されていることを確認する • ディストリビューションドメイン名のリンクをクリックしてアクセス確認する ▪ 日本のIPアドレスからの接続だと403エラーが発生することを確認する 90

Slide 91

Slide 91 text

© 2022, Amazon Web Services, Inc. or its affiliates. Web ACLへのマネージドルールの追加 • WAFのメニューから「Web ACLs」をクリック • リージョンで「Global (CloudFront) 」を選択 • Web ACLsから「handson-waf」をクリック 91

Slide 92

Slide 92 text

© 2022, Amazon Web Services, Inc. or its affiliates. Web ACLへのマネージドルールの追加 • 「Rules」タブを選ぶ • 「Add rules」から「Add managed rule groups」を選ぶ 92

Slide 93

Slide 93 text

© 2022, Amazon Web Services, Inc. or its affiliates. Web ACLへのマネージドルールの追加 • 「AWS managed rule groups」のトグルを開く • 「Core rule set」の「Add to web ACL」スライドスイッチをオンにする • 画面下部の「Add rules」を追加する • 優先順位確認画面で「Save」をクリックする 93

Slide 94

Slide 94 text

© 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. リソースの削除 94

Slide 95

Slide 95 text

© 2022, Amazon Web Services, Inc. or its affiliates. Amazon CloudFront Distributionの削除 • CloudFrontメニューの「ディストリビューション」を選ぶ • 作成したディストリビューションにチェックを入れて、「無効」をクリック • デプロイが完了したら「削除」をクリック 95

Slide 96

Slide 96 text

© 2022, Amazon Web Services, Inc. or its affiliates. Amazon CloudFront Policiesの削除 • CloudFrontメニューの「ポリシー」を選ぶ • 「キャッシュ」タブからカスタムポリシー「handson-cacheplicy」を選択し、 「削除」をクリック • 「オリジンリクエスト」タブからカスタムポリシー「handson-originrequestpolicy」を選択し、 「削除」をクリック 96

Slide 97

Slide 97 text

© 2022, Amazon Web Services, Inc. or its affiliates. AWS WAFの削除 • WAF&Shieldメニューの「Web ACLs」を選ぶ • リージョン画面で「Global (CloudFront)」を選択する • 「handson-waf」を選択し、「Delete」をクリック • 表示されるダイアログ内のフィールドに「delete」と入力して実行 97

Slide 98

Slide 98 text

© 2022, Amazon Web Services, Inc. or its affiliates. API Gatewayの削除 • API Gatewayメニューの「API」を選ぶ • 「handson-api」を選択し、「アクション」プルダウンから「Delete」をクリック 98

Slide 99

Slide 99 text

© 2022, Amazon Web Services, Inc. or its affiliates. Lambdaの削除 • Lambdaメニューの「関数」を選ぶ • 「handson-lambda」にチェックを入れ、「アクション」プルダウンから「削除」をクリック 99

Slide 100

Slide 100 text

© 2022, Amazon Web Services, Inc. or its affiliates. s3の削除(バケットを空にする) • S3のメニューの「バケット」を選ぶ • 「空にする」をクリック • 確認が表示されるので、「完全に削除」と入力して「空にする」をクリック 100

Slide 101

Slide 101 text

© 2022, Amazon Web Services, Inc. or its affiliates. s3の削除(バケットを削除する) • 再び「バケット」から空にしたバケットを選択 • 「削除」をクリック • 出てくるメニューでバケット名を入力して「バケットを削除」をクリック 101

Slide 102

Slide 102 text

© 2022, Amazon Web Services, Inc. or its affiliates. おつかれさまでした! • 以上で、すべてのハンズオンを終了し、作成したリソースも削除しました 102

Slide 103

Slide 103 text

© 2024, Amazon Web Services, Inc. or its affiliates. Thank you! © 2024, Amazon Web Services, Inc. or its affiliates.