SlideShare a Scribd company logo
API Gateway 事始め
〜 触って覚えるAPI Gateway 〜
2016/06/24 JAWS-UG名古屋 AWS勉強会 第12回
自己紹介
青池 利昭
 ▷ 兵庫県尼崎市出身
 ▷ cloudpack 大阪で MSP開発 やってます
 ▷ お酒が大好きです!!
 ▷ facebook: aoike.toshiaki
facebookでC3(Can Convenience Club) やってます!
アジェンダ
❏ API Gatewayの特徴
❏ API Gatewayの使い方(ハンズオン)
❏ API Gatewayのハマリどころ
ー API Gatewayの特徴 ー
API Gatewayの特徴
❏ API の作成、配布等をマネージドに管理
❏ APIのステージ、バージョン管理
❏ いろいろと出来るセキュリティ機能
❏ 既存のサービスのフロントエンドにもなる
❏ Lambdaを使えばEC2レスなサービスの作成が可能
etc…
API Gatewayの特徴
何はなくともマネージド!!
API Gatewayの特徴
ロジックに集中出来る
これが重要!!
ー API Gatewayの使い方 ー
API Gatewayの使い方
   APIの作成
   リソースとメソッドを設定
   ステージにデプロイ(ここで初めて外部に公開可能となる)
1
2
3
ー まずは説明 ー
APIの用意
❏ New API(1から自分で作成)
❏ Clone from existing API(既存のAPIからクローンを作成)
❏ Import from Swagger(Swaggerの定義から生成)
❏ Example API(提供されているサンプルを使って作成)
etc…
New API
❏ 自分で一から設定していく
❏ 特に難しいことはない
Clone from existing API
❏ 既存のAPIの複製を作成 実はハマリどころ有り
Import from Swagger
❏ Swagger Spec Fileを取り込んで作成
What is Swagger ?
❏ RESTful APIの記述標準化を目指す規格
RESTful ?
❏ RESTの定義に従った REpresentational State Transfer
❏ リソースベースでURIをもってアクセス
❏ HTTPメソッドを利用したCRUD
etc…
Web API
❏ よくあるXMLやJSONで結果を返すたりしてくれるサービスなど
❏ RESTといえばだいたいこっちを指している事が多い
etc…
Swaggerのメリット
❏ 仕様書のフォーマットの統一
❏ テキストベースで編集も可能
❏ コードと一緒にバージョン管理が可能
❏ 複製が作りやすい
❏ Swagger UIを利用してAPIの動作確認が出来る
etc…
Example API
❏ サンプルから作成(このサンプルのJSONは編集できない)
Example API
❏ このようにリソースとメソッドが自動で作成される
メソッド
❏ 定義可能なメソッド
代表的なものは利用可能
DELETE PATCH
GET POST
HEAD PUT
OPTIONS
機能
❏ 利用可能な機能
Lambda
HTTP Proxy
Mock
AWS Proxy
ー ここからハンズオン ー
1st Step
1st Step
❏ New API を選択して API name に handson と入力して Create API を押下
Resourceを準備
GET Methodを追加
Mock Integrationを指定して保存
Integration Response を選択
Integration Response を選択
ダミーのレスポンスを返す設定を実施
ここまで出来たら一旦テスト
テストを実行するとMockに設定した値が取得出来る
APIをデプロイ
ステージを設定してデプロイ
デプロイ完了
ブラウザで確認
Lambdaを作成
Lambdaを作成
Lambdaを作成
Lambdaを作成(コードは https://goo.gl/DEKa2c からダウンロードできます)
Lambdaを作成
Lambdaを作成
Lambdaを作成
Lambdaを作成
Lambdaを作成
Mock→Lambdaに変更
Mock→Lambdaに変更
Mock→Lambdaに変更
重要!!
Mock→Lambdaに変更
テスト
APIをデプロイ
ステージを設定してデプロイ
デプロイ完了
ブラウザで確認
❏ キャッシュが効いている場合は値がMockのままになるのでブラウザをスーパーリ
ロードするかセッションを分けてアクセスして下さい。
ー API キーを設定 ー
APIキーを作成
APIキーを作成
APIキーの利用設定
APIキーの利用設定
APIをデプロイ
ステージを設定してデプロイ
デプロイ完了
ブラウザで確認
❏ キャッシュが効いている場合は値がMockのままになるのでブラウザをスーパーリ
ロードするかセッションを分けてアクセスして下さい。
APIキーの確認
APIキーをヘッダに指定してリクエストを送信
❏ リクエストヘッダに x-api-key を追加して API キーを指定すると期待している結果
を得ることができる。
APIキーをヘッダに指定してリクエストを送信
ー CORS (Cross-Origin Resource Sharing) 設定 ー
CORSを有効にする
CORSを有効にする
CORSを有効にする
CORSを有効にする
APIをデプロイ
ステージを設定してデプロイ
デプロイ完了
ー WAF ー
ルールの新規作成
ルールの新規作成
ルールの設定(IP制限)
ルールの設定(IP制限)
ルールの完成
ACLの作成
デフォルトのまま
先に作ったルールを割り当て
ACLを作成
これにてWAFの作成完了
CloudFrontの作成
CloudFrontの作成
CloudFrontの作成
CloudFrontの作成
CloudFrontの作成
CloudFrontの作成
CloudFrontの作成
アクセスしてみる
アクセスしてみる(未許容のIP)
ー API Gatewayのハマリどころ ー
API Gatewayのハマリどころ
❏ APIをクローンしたまま使うとLambdaのアクセス権限が付与されておらずぱっと見
問題無い設定に見えるが動かない
❏ Lambda呼び出しの際に「Invoke with caller credentials」を指定するとリクエスト時
のIAM指定してLambdaを実行出来るが、このIAMにLambdaの実行権限がないと
Lambdaが発火しない
❏ Lambda(Python2.7)をバックエンドにするとRequestデータがJSON形式でないと
発火しない
❏ API Gateway UIの使いにくさ(設定変更時に レ を押さないと反映されない)
etc…
ー 参考 ー
参考
❏ IP制限できないの?
→ CloudFront(WAF)+ APIキー認証で絞りましょう
→ マッピングテンプレートを使ってSourceIpを取得しコードでブロック
❏ HTTPでアクセスしたい
→ CloudFrontでHTTPからHTTPSにリダイレクトしましょう
❏ 後ろがLambda(Python 2.7)の場合にJson形式以外の値を処理したい
→ マッピングテンプレートを使ってJson形式に変更しちゃいましょう
AWS Black Belt Tech シリーズ 2015 - Amazon API Gateway
❏ http://www.slideshare.net/AmazonWebServicesJapan/aws-black-belt-tech-
2015-amazon-api-gateway
最後に
cloudpack wants you !!
開発・インフラ・デザイナーを募集しています
https://cloudpack.jp/recruit/
ご清聴ありがとうございました

More Related Content

PPTX
10分でわかるOpenAPI V3
PPTX
React meetup 3_eight
PDF
Swaggerで始めるモデルファーストなAPI開発
PDF
A 1-2 One ASP.NET - ASP.NET Web Stack
PDF
ReactをRailsとどっぷり使ってみた話と、フロントエンド×AWSのこれから
PDF
スマホアプリ開発者のためのWeb api開発入門の入門
PDF
JAWSUG初心者支部 AWSの勉強の仕方
PDF
サーバサイドエンジニアが 1年間まじめにSPAやってみた
10分でわかるOpenAPI V3
React meetup 3_eight
Swaggerで始めるモデルファーストなAPI開発
A 1-2 One ASP.NET - ASP.NET Web Stack
ReactをRailsとどっぷり使ってみた話と、フロントエンド×AWSのこれから
スマホアプリ開発者のためのWeb api開発入門の入門
JAWSUG初心者支部 AWSの勉強の仕方
サーバサイドエンジニアが 1年間まじめにSPAやってみた

What's hot (20)

PDF
ReactNativeを語る勉強会
PDF
ドローンの安全運転をささえるLambda
PDF
軽量ASP.NETフレームワークNancy
PDF
スキスキIonic
PDF
2016/05/01 Visual Studio with Cordova
PPTX
2016/12/17 ASP.NET フロントエンドタスク入門
PPTX
普段Reactを触ってる僕が Angularを触ってみた感想を共有する
PDF
Sinatra軽量Web開発 - LOUPE Study #1
PDF
Svgアニメーションを実装してみよう 20150207
PPTX
社内LTネタ ReactNative
PPTX
Editorlt
PDF
Realm,rx swift,repro を使ってみて
PDF
DevLove Kansai AWS
PDF
軽量フレームワークNancy
PDF
Directiveで実現できたこと
PDF
React Native 入門
PPTX
kintoneの大規模フロントエンド開発とツール
PPTX
AWS Lambdaのテストで役立つ各種ツール
PDF
grpc-gateway を試してみた fukuoka.go#11
PPTX
React NativeでTwitterクライアントを作ってみよう
ReactNativeを語る勉強会
ドローンの安全運転をささえるLambda
軽量ASP.NETフレームワークNancy
スキスキIonic
2016/05/01 Visual Studio with Cordova
2016/12/17 ASP.NET フロントエンドタスク入門
普段Reactを触ってる僕が Angularを触ってみた感想を共有する
Sinatra軽量Web開発 - LOUPE Study #1
Svgアニメーションを実装してみよう 20150207
社内LTネタ ReactNative
Editorlt
Realm,rx swift,repro を使ってみて
DevLove Kansai AWS
軽量フレームワークNancy
Directiveで実現できたこと
React Native 入門
kintoneの大規模フロントエンド開発とツール
AWS Lambdaのテストで役立つ各種ツール
grpc-gateway を試してみた fukuoka.go#11
React NativeでTwitterクライアントを作ってみよう
Ad

Similar to 20160624 JAWS-UG名古屋 第12回 API Gateway 事始め (20)

PDF
Jawsug chiba API Gateway
PDF
Serverless for VUI
PPTX
DRIVE CHARTの裏側 〜 AI ☓ IoT ☓ ビッグデータを 支えるアーキテクチャ 〜
PPTX
EC-CUBE API プラグイン勉強会
PPTX
Fun tech14-alibaba cloud api gateway-swagger
PDF
AWSによるサーバーレスアーキテクチャ
PPTX
Web API を気軽に使える ツールやサービスのご紹介
PPTX
アウトプットはスキルアップもするしトクもする
PDF
#decode19 #MW04 誰のための API? Azure デベロッパーにもエンド ユーザーにも嬉しいAPI エコシステム活用アプローチ
PDF
仮想通貨取引所 bitbank の IaC の導入と実践
PDF
"Kongゲートウェイ2.5リリース" Kong Konnectアップデート オンラインミートアップ :kong 製品整理、優位性
PPTX
Swagger jjug ccc 2018 spring
PPTX
APIモック3分クッキング
PDF
サーバーレスの今とこれから
PDF
AWSで開発するサーバレスAPIバックエンド
PDF
Talk: serverless-express
PDF
Whats ACI API?
PDF
Going Serverless, Building Applications with No Servers
PPTX
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
PDF
Azureをフル活用したサーバーレスの潮流について
Jawsug chiba API Gateway
Serverless for VUI
DRIVE CHARTの裏側 〜 AI ☓ IoT ☓ ビッグデータを 支えるアーキテクチャ 〜
EC-CUBE API プラグイン勉強会
Fun tech14-alibaba cloud api gateway-swagger
AWSによるサーバーレスアーキテクチャ
Web API を気軽に使える ツールやサービスのご紹介
アウトプットはスキルアップもするしトクもする
#decode19 #MW04 誰のための API? Azure デベロッパーにもエンド ユーザーにも嬉しいAPI エコシステム活用アプローチ
仮想通貨取引所 bitbank の IaC の導入と実践
"Kongゲートウェイ2.5リリース" Kong Konnectアップデート オンラインミートアップ :kong 製品整理、優位性
Swagger jjug ccc 2018 spring
APIモック3分クッキング
サーバーレスの今とこれから
AWSで開発するサーバレスAPIバックエンド
Talk: serverless-express
Whats ACI API?
Going Serverless, Building Applications with No Servers
俺とサーバレスアーキテクチャ Aws cognito + aws api gateway 編
Azureをフル活用したサーバーレスの潮流について
Ad

20160624 JAWS-UG名古屋 第12回 API Gateway 事始め