API GatewayでMockを統合したWebSocket APIを作成
やりたいこと
API Gatewayを使ってWebSocket通信を実装できるらしい。
とりあえずつながることを確認するためにLambdaなどバックエンドを作らずにMock統合で接続したい。
方法
英語ですが、良い資料が見つかりました。
https://stackoverflow.com/questions/55594587/setup-a-basic-websocket-mock-in-aws-apigateway
この資料を参考に独自に設定していきたいとおもいます。
-
WebSocket Apiを作成する
API名を「MockWebSocketAp」ルート選択式を「request.body.message」とします。
-
$connectルートを事前定義 -
$connectにMockを統合$disconnectルート(切断したときのルート)、$default($connect,$disconnect以外のルート)もありますが、今回は接続できたら良しとするので$connectルートのみ設定していきます。 -
ステージ名を「production」で作成
-
$connectのルートに双方向通信を有効にしてデプロイ
これによってクライアント→サーバー、サーバー→クライアントへの通信が可能になります。
-
この状態でクライアントからの通信を試してみる
ステータスコード500が返ってきました。
Mock統合のWebSocket APIでステータスコード200を返すにはRest Api同様、統合リクエストで{"statusCode": 200}を渡してあげる必要があるみたいです。
https://docs.aws.amazon.com/ja_jp/apigateway/latest/developerguide/how-to-mock-integration.html -
$connectの統合リクエストタブを選択 -
テンプレート選択式を200を作成
-
「テンプレートを作成」をクリックし、テンプレートキーを200 テンプレートを{"statusCode": 200}で作成(テンプレート選択式とテンプレートキーは200じゃなくても構いませんが、値は一致させる必要があります)
-
$connectの統合レスポンスタブを選択 -
統合レスポンスを作成ボタンをクリックし、レスポンスキーに$defaultまたは200を入力してレスポンスを作成
(レスポンスキーはバックエンドからのステータスコードの正規表現を設定することでレスポンスをルーティングすることができます。
レスポンスキーに$defaultにすることでステータスコードが設定したレスポンスキーのどれにも当てはまらなかった場合のレスポンスを作成することができます)
ここまで設定できたら再びAPIのデプロイを行い、接続を試みてみます。
接続できてるっぽいです。
$defaultルートを設定してあげることでさらに拡張して実装できそうですが、今回はWebSocket APIとりあえず試してみたかっただけなので、$connectルートのみ設定しました。
まとめ
以上がAPI GatewayでのWebsocket API(Mock統合)の作成手順でした。
Lambda + DynamoDBでchatアプリなど本格的なソケット通信を実装できるみたいなので今度そちらの検証もしていけたらなと思います。
https://docs.aws.amazon.com/ja_jp/apigateway/latest/developerguide/websocket-api-chat-app.html