Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Cognito+API Gateway+Lambda+S3ではじめるサーバーレスアプリ構築 / Building Serverless Apps with Cognito+API Gateway+Lambda+S3

Cognito+API Gateway+Lambda+S3ではじめるサーバーレスアプリ構築 / Building Serverless Apps with Cognito+API Gateway+Lambda+S3

JAWS DAYS 2021のオンライン登壇で使用した発表資料です。
https://jawsdays2021.jaws-ug.jp/timetable/track-b-1600/

Hironori Yokoyama

March 20, 2021
Tweet

More Decks by Hironori Yokoyama

Other Decks in Technology

Transcript

  1. 0
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    Cognito+API Gateway+Lambda+S3で
    はじめるサーバーレスアプリ構築
    ~SIer企業がはじめて挑戦してみた話~

    View Slide

  2. 1
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    横山 弘典
    (@yokoyantech)
    • 株式会社システムインテグレータ
    • 製品企画室
    • 宮崎→福岡→埼玉
    • AWS歴
    • 約7年
    • アソシエイト3冠
    • SAプロフェッショナル
    • JAWS歴
    • 2014年から毎年参加
    • 2020年初登壇(動画)

    View Slide

  3. 2
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    毎年ボッチ参加なので
    今年こそはJAWS仲間を作りたい!

    View Slide

  4. 3
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    1. 本日お伝えすること
    2. サーバーレスアーキテクチャを採用した理由
    3. サーバーレスでREST APIを作る
    4. サーバーレスでWEBアプリを作る
    5. 非同期処理を作る
    6. デプロイ/負荷試験
    Agenda

    View Slide

  5. 4
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    新サービス開発で、はじめて
    サーバーレスを使った体験談をお伝えします

    View Slide

  6. 5
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    株式会社システムインテグレータ
    • 埼玉県さいたま市にある会社
    • 東証1部
    • 創業27年目
    • 事業内容
    • 自社パッケージソフト(EC、ERPなど)
    • 企画、開発
    • カスタマイズ
    • 自社WEBサービス
    • 開発、運営
    • 技術スタック
    • AWS、Azure
    • Java、C#、Python、Rubyなど

    View Slide

  7. 6
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator

    View Slide

  8. 7
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator

    View Slide

  9. 8
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    1. 本日お伝えすること
    2. サーバーレスアーキテクチャを採用した理由
    3. サーバーレスでREST APIを作る
    4. サーバーレスでWEBアプリを作る
    5. 非同期処理を作る
    6. デプロイ/負荷試験
    Agenda

    View Slide

  10. 9
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    限られた人数で
    やることはいっぱい
    アプリ開発 インフラ開発 各種サポート

    View Slide

  11. 10
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    家族や子供との時間も
    大切にしたい

    View Slide

  12. 11
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    精神論で頑張らない
    AWSで仕組みを変える

    View Slide

  13. 12
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    サーバーレスを使うと
    好きなことをやる時間が増える!

    View Slide

  14. 13
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    受験者が
    コードを提出
    外部APIで採点
    (テストケース実行)
    成否を判定
    私達のプロダクト特徴

    View Slide

  15. 14
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    AWS Cloud
    受験者
    Amazon EC2
    Public subnet
    Elastic Load Balancing
    NAT gateway
    Amazon RDS
    他社外部API
    (提出/採点)
    ※EC2+α
    Private subnet

    View Slide

  16. 15
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator

    View Slide

  17. 16
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator

    View Slide

  18. 17
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    大規模イベントでは、採点システムが
    数百台必要になるケースもあった

    View Slide

  19. 18
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    新サービス(SQL)では、
    自社で採点システムを保持・運用

    View Slide

  20. 19
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    EC2などのよくある悩み
    コスト高い
    (待機時間含)
    運用が自力
    (HDD容量等)
    自動スケール
    設定が必要

    View Slide

  21. 20
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    コスト安い
    (実行時間)
    運用が楽
    自動スケール
    設定が不要
    サーバーレスで解決

    View Slide

  22. 21
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    スパイク対策、コスト減、運用を楽にするために
    サーバーレスを採用

    View Slide

  23. 22
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    1. 本日お伝えすること
    2. サーバーレスアーキテクチャを採用した理由
    3. サーバーレスでREST APIを作る
    4. サーバーレスでWEBアプリを作る
    5. 非同期処理を作る
    6. デプロイ/負荷試験
    Agenda

    View Slide

  24. 23
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    API Gateway Lambda NoSQL
    サーバーレスでREST API

    View Slide

  25. 24
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    提出API
    提出コード
    書き込み
    提出結果
    保持
    サーバーレスでREST API

    View Slide

  26. 25
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    MongoDB Atlas
    • MongoDBとは
    • jsonを格納するドキュメント型のNoSQL
    • Atlasとは
    • MongoDB公式が提供するDaaS
    • フルマネージドサービス
    • AWS連携が簡単
    • VPCピアリングできる!
    • セキュリティグループによる制御できる!
    • 東京リージョンあり

    View Slide

  27. 26
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    EC2からPRIVATEなAPIを呼び出したい(受験者→提出API)
    AWS Cloud
    users
    Amazon API Gateway
    (PRIVATE)
    AWS Lambda
    Peering
    connection
    VPC
    Amazon EC2
    Public subnet
    Elastic Load Balancing
    NAT gateway
    Private subnet

    View Slide

  28. 27
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    EC2からPRIVATEなAPIを呼び出したい(受験者→提出API)
    AWS Cloud
    users
    Amazon API Gateway
    (PRIVATE)
    AWS Lambda
    Peering
    connection
    VPC
    Amazon EC2
    Public subnet
    Elastic Load Balancing
    NAT gateway
    Private subnet
    Private Subnet内のLambdaを
    API Gatewayがどうやって呼び出すの?

    View Slide

  29. 28
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【原因】LambdaをVPC内に配置した際に
    想像した図が間違っていた

    View Slide

  30. 29
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    AWS Cloud
    AWS管理VPC 私達のVPC
    AWS Lambda
    Elastic network
    interface
    LambdaをVPC内に配置すると、
    私達のVPCの中に、ENIができる
    Private subnet

    View Slide

  31. 30
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    AWS Cloud
    AWS管理VPC 私達のVPC
    AWS Lambda
    Elastic network
    interface
    Private subnet
    Lambdaの実体は、
    AWS管理VPC側に存在する

    View Slide

  32. 31
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    AWS Cloud
    AWS管理VPC 私達のVPC
    AWS Lambda
    Elastic network
    interface
    Private subnet
    Lambdaの実体は、
    AWS管理VPC側に存在する

    View Slide

  33. 32
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    AWS Cloud
    AWS管理VPC 私達のVPC
    AWS Lambda
    Elastic network
    interface
    Lambdaは、 ENI経由で
    私達のVPC内のリソースにアクセスできる
    Amazon RDS
    Private subnet

    View Slide

  34. 33
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    Private subnet
    API GatewayからLambdaを呼ぶときは、
    AWS内部のネットワークを通る
    AWS Cloud
    AWS管理VPC 私達のVPC
    Amazon API Gateway
    (PRIVATE)
    AWS Lambda
    Elastic network
    interface

    View Slide

  35. 34
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【対策】VPC Endpoint とENIを使う

    View Slide

  36. 35
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    【修正後】EC2からPRIVATEなAPIを呼び出したい
    AWS Cloud
    users
    Amazon API Gateway
    (PRIVATE)
    AWS Lambda
    Peering
    connection
    VPC
    Amazon EC2
    Public subnet
    Elastic Load Balancing
    NAT gateway
    Elastic network
    interface
    Endpoints
    Private subnet

    View Slide

  37. 36
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    1. 本日お伝えすること
    2. サーバーレスアーキテクチャを採用した理由
    3. サーバーレスでREST APIを作る
    4. サーバーレスでWEBアプリを作る
    5. 非同期処理を作る
    6. デプロイ/負荷試験
    Agenda

    View Slide

  38. 37
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    S3 Cognito API Gateway
    サーバーレスでWEBアプリ

    View Slide

  39. 38
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    HTML/JS
    配置
    ログイン時
    認証
    問題登録
    API など
    サーバーレスでWEBアプリ

    View Slide

  40. 39
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    S3で静的ホスティング+API呼び出し
    AWS Cloud
    users
    Amazon API Gateway
    (Edge)
    Amazon S3
    Amazon Cognito
    AWS Lambda
    Peering
    connection
    VPC
    Elastic network
    interface
    Private subnet

    View Slide

  41. 40
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    クリップボード貼り付け処理

    View Slide

  42. 41
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    httpで動いていた

    View Slide

  43. 42
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【原因】S3は、Web Site Endpointの
    HTTPSアクセスをサポートしていない

    View Slide

  44. 43
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【対策1】CloudFrontを使ってHTTPSを実現

    View Slide

  45. 44
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/dev/WebsiteHosting.html

    View Slide

  46. 45
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【対策2】S3 REST APIエンドポイントを使う

    View Slide

  47. 46
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    http://バケット名.s3-website-ap-northeast-
    1.amazonaws.com/index.html
    ウェブサイト エンドポイント

    View Slide

  48. 47
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    https://バケット名.s3-ap-northeast-
    1.amazonaws.com/index.html
    REST API エンドポイント

    View Slide

  49. 48
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/dev/WebsiteEndpoints.html#WebsiteRestEndpointDiff

    View Slide

  50. 49
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    1. 本日お伝えすること
    2. サーバーレスアーキテクチャを採用した理由
    3. サーバーレスでREST APIを作る
    4. サーバーレスでWEBアプリを作る
    5. 非同期処理を作る
    6. デプロイ/負荷試験
    Agenda

    View Slide

  51. 50
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    Lambda SQS Lambda
    サーバーレスで非同期処理

    View Slide

  52. 51
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    採点キュー
    書き込み
    キュー管理 採点処理
    サーバーレスで非同期処理

    View Slide

  53. 52
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    提出処理と採点処理の間にSQSを入れて非同期化
    AWS Cloud
    users Amazon API Gateway
    (PRIVATE)
    AWS Lambda(提出)
    Peering
    connection
    VPC
    Amazon EC2
    Elastic network
    interface
    Endpoints
    Amazon SQS AWS Lambda(採点)
    Public subnet
    Elastic Load Balancing
    Private subnet

    View Slide

  54. 53
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【問題1】Lambdaがデプロイできない

    View Slide

  55. 54
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【原因】SQSの可視性タイムアウト(30秒)が
    Lambdaのタイムアウト(300秒)より短い

    View Slide

  56. 55
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【対策】SQSの可視性タイムアウトを
    Lambdaのタイムアウトより長くする

    View Slide

  57. 56
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【問題2】採点Lambdaに1度に複数の
    採点キューが渡されてしまう

    View Slide

  58. 57
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    VPC
    提出処理と採点処理の間にSQSを入れて非同期化
    AWS Cloud
    users Amazon API Gateway
    (PRIVATE)
    AWS Lambda(提出)
    Peering
    connection
    VPC
    Amazon EC2
    Elastic network
    interface
    Endpoints
    Amazon SQS AWS Lambda(採点)
    Public subnet
    Elastic Load Balancing
    Private subnet

    View Slide

  59. 58
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【原因】SQSトリガーの
    バッチサイズが1より大きい

    View Slide

  60. 59
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    【対策】SQSトリガーの
    バッチサイズを1にする

    View Slide

  61. 60
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    マネジメントコンソールからは変更ができない

    View Slide

  62. 61
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    1. 本日お伝えすること
    2. サーバーレスアーキテクチャを採用した理由
    3. サーバーレスでREST APIを作る
    4. サーバーレスでWEBアプリを作る
    5. 非同期処理を作る
    6. デプロイ/負荷試験
    Agenda

    View Slide

  63. 62
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    CodePipeline
    CodeBuild+
    Serverless
    CodeDeploy
    サーバーレスのデプロイ

    View Slide

  64. 63
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator

    View Slide

  65. 64
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    Serverless-framework
    • node.js製のツール
    • サーバーレスアプリをAWS上に簡単にデプロイできる
    (内部的にはCloudFormationが動いている)
    • 構成をYAMLで書ける
    • 例)GETリクエストでLambda関数helloを実行する
    API Gatewayを作成する
    • CodeBuild等と組み合わせると簡単にPipelineができる
    # serverless.yml
    functions:
    index:
    handler: handler.hello
    events:
    - http: GET hello
    $ serverless deploy

    View Slide

  66. 65
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    サーバーレスの負荷試験
    https://github.com/Nordstrom/serverless-artillery

    View Slide

  67. 66
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    Serverless-artillery
    • サーバーレスで負荷試験ができる
    • AWS上に負荷を生成するLambdaを簡単に生成できる
    • 試験シナリオがYAMLで書ける
    • 例)秒間10アクセスの負荷を5秒実行する
    • 負荷試験実行も簡単
    config:
    target: http://TESTURL/
    phases:
    - duration: 5
    arrivalRate: 10
    scenarios:
    - flow:
    - get:
    url: "/"
    slsart deploy --region=ap-northeast-1
    slsart invoke --region=ap-northeast-1

    View Slide

  68. 67
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    限られた人数で
    やることはいっぱい
    アプリ開発 インフラ開発 各種サポート

    View Slide

  69. 68
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    精神論で頑張らない
    AWSで仕組みを変える
    (わからなくても まずは挑戦!)

    View Slide

  70. 69
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    サーバーレスを活用して
    みなさん素敵な人生を!

    View Slide

  71. 70
    Copyright© System Integrator Corp. All rights reserved.
    System Integrator
    ※本資料掲載の情報・画像など、すべてのコンテンツの無断複写・転載を禁じます。

    View Slide