web-dev-qa-db-ja.com

AWS CloudFrontとAPI Gatewayを同じドメインで並べて使用するにはどうすればよいですか?

私はウェブサイトの静的アセットをS3に配置し、CloudFrontをセットアップしてそれらを配布しています。これらは基本的に、ユーザーが私のサイトで既存のパスへのGETリクエストに必要なコンテンツ、つまりエラーのキャッチオールを保持します。

また、処理する必要があるいくつかのPOST要求があります。フォームの送信、電子メールの送信、通知、データベースとの対話。

CloudFrontがGETリクエストを処理し、API Gatewayが本文またはPOSTリクエストを含むリクエストを処理するように、同じドメインのCloudFrontとLambda(またはAPI Gateway)を並べて設定するにはどうすればよいですか。またはどういうわけか個別URLでやってますか?

9
Costa

私は提案されたデザインで正確に複数のWebアプリを実行し、技術を共有するために教育的なGoおよびLambdaアプリである gofaas を抽出しました。

たとえば、2つの個別のドメインが必要です。 www.gofaas.net for S3 + CloudFrontおよびapi.gofaas.net for API Gateway + Lambda。

次に、API GatewayのCORS構成といくつかのJavaScriptを使用して、静的サイトをAPIと相互作用させることができます。

fetch(`https://api.gofaas.net/work`, {
    method: "POST",
    mode: "cors",
    headers: {
        "Accept": "application/json",
        ...
    },
    body: JSON.stringify(...)
})
    .then(function(response) {
        return response.json();
    })
    .then(function (json) {
        // use response
    })
    .catch(function (err) {
        console.log("fetch error", err);
    });

これをすべて設定するためのガイドを以下に示します。

S3、CloudFront、およびACMを使用した静的ウェブサイト

Lambda、API Gateway、CORS、JWTを使用したAPIセキュリティ

2
Noah Zoschke

ラムダ関数を作成し、APIゲートウェイをセットアップしてから、特定のパス(/ rest/*など)をAPIゲートウェイに転送し、S3バケットからその他すべてを提供するようにCloudFrontを構成できます。

これを行う方法を示す完全なウォークスルーを次に示します。 https://www.codeengine.com/articles/process-form-aws-api-gateway-lambda/

6
Grodriguez

同じ設定です。 S3の静的アセット、APIゲートウェイを介して提供されるLambda関数、およびそれらは同じドメイン名を共有します。

私はすでにCloudFrontを使用しており、キャッシングなどのいくつかの機能を公開しているAPIゲートウェイを使用します。次に、静的アセットにマップするURIを構成します。 API Gatewayでは、リソースはLambda関数、AWS関数、モック、または別のURLにすることができます。 S3のURLをポイントしてもらいます。

URIは、サブパスをグロブアップするように設定できます。 /assets/*

2

接続の観点からは、「何か」が要求(GET、POST、PUTなど)に応答する必要があります。まず、TCP=接続があり、「何か」は、それがレイヤー7を理解し、クライアントが送信しているバイトを理解していることを確認する必要があります。この時点でのみ、 POSTリクエストまたは別のURLよりも1つのURLとは異なる方法でGETリクエストを処理します。そのため、最終的には、HTTPを理解してルーティングできるサービスが必要です。次のサービスがこれを実行できます:CloudFront ELB/ALB APIゲートウェイ(制限は後で来る)

API GatewayはCloudFrontを内部で使用します(実際にCloudFrontレベルで何かを構成する機会を与えることはありません)。つまり、最終的にCloudFrontをCloudFrontで実行することになるため、CloudFrontとAPI Gatewayを並べて実行する方法はありません。並んで。

CloudFrontを使用すると、パターンに基づいて異なるオリジンを選択できます。ただし、S3またはELB/ALBのみをオリジンとして選択でき、Lambda関数(Lambda @ Edge機能以外)は選択できません。

ALB/ELBはEC2インスタンスのみをバックエンドとして使用できます-ここではLambdaまたはS3は使用できません。

私があなたがしたいことをするかもしれないと考えることができる唯一の方法はこれらです:

  • API Gatewayを使用して、特定の「アセット」パスをS3の一種のリバースプロキシを実行するLambda関数にルーティングします(ラムダを介して静的アセットをパイプする)-ここでLambdaのコストに注意してください!
  • 同じことを行うこともできますが、Lambdaを介してアセットをパイプ処理する代わりに、Lambda内で署名付きURLを生成し、S3に直接リダイレクトして配信します(コスト効率が向上する可能性があります)。
  • アセットにアプリケーションの他の部分とは異なるサブドメインを使用する-これは非常に一般的なパターンです。これは、DNSレベルで簡単に分割して、さまざまなユースケース(CloudFrontをアセットに、API Gatewayを非静的に)に簡単に使用できるためです。部品)

したがって、私の呼び出しが最後のオプションになります-しかし、これは、すべての静的アセット(またはすべてのPOSTリクエスト)に対して、クライアント/ブラウザに個別のサブドメインを指定する必要があることを意味します。

AngularJSやReactなどのテクノロジーを見て、ブラウザーで真にAPI駆動のアプリケーションを構築したいと考えています。このアプローチでは、すべてを処理する実際のAPIを実行しています。 API Gatewayを使用した「動的」リクエストと静的アセットとしてS3からアプリケーション自体を配信します。これらを確認すると、方法を見つけるのに役立つ場合があります-それらを使用しなくても、物事を構築する方法のアーキテクチャパターンこのように私はあなたが私見を求めているものです。

2
Osterjour