2017-06-02 20 views
0

SPAはAngular(Angular2、Angular4、Angular4ではなくAngular4S)で記述され、Azure ADに対してOAuth2を使用して認証されます。認証を処理するためにOIDC libraryを使用しています。認証リダイレクトを使用するAWS S3でAngular SPAをホスト

アプリケーションは、静的なWebサイトを提供するように構成されたAWS S3バケットでホストされています。議論のために、URLがmyapp.example.comのふりをしましょう。

ユーザーがログインボタンをクリックすると、ユーザーは認証を処理するためにMicrosoftページにリダイレクトされます。ここまでは順調ですね。認証されると、myapp.example.com/loginにリダイレクトされます。

私のS3バケットには、loginというアーティファクトはありません。 loginルートはAngularルーターによって処理され、アプリケーション内のコンポーネントを呼び出します。これは私のローカルマシンで実行しているときに開発でうまく動作します。しかし、S3でホストされているバージョンを実行すると、myapp.example.com/loginへのリダイレクトは404エラーで失敗します。

エラーの理由を理解しています - S3バケットにloginというアーティファクトがありません。しかし、私はこれが私のアプリのちょうどあらゆるリンクの問題だと思います。たとえば、別のユーザーとmyapp.example.com/objects/1234へのリンクを共有した場合、404の場合も同様です。

したがって、リダイレクトやその他のリンクが正しく動作するように、このSPAをAWSに正しくホストするために必要なことは何ですか?

答えて

1

S3の前でAWS CloudFrontを設定し、CloudFront(CNAMEの場合)のドメインマッピングを行います。 AWS Edge Lambdaを使用して、/ loginのURLをindex.htmlに直接書き換えることができます。

これは、/ loginパスに対してもindex.htmlをロードし、リダイレクトが発生した後に、クライアント側からの角度を指定してルートをトリガーします。

関連する問題