web-dev-qa-db-ja.com

増幅パブリッシュによりAccessDeniedエラーが発生する

シンプルなWebアプリをS3経由でamplify publishにデプロイします。ホスティングではCloudfrontが有効になっていて(ホスティングのセットアップ中にamplifyでPROD環境を選択しました)、eu-central-1リージョンで作業しています。しかし、Cloudfront URLにアクセスしようとすると、AccessDeniedエラーが表示されます。

https://medium.com/quasar-framework/creating-a-quasar-framework-application-with-aws-amplify-services-part-1-4-9a795f38e16d an私が違ったことをした唯一のことは地域でした(チュートリアルではus-east-1を使用していますが、eu-central-1を使用しています)。

S3とCloudfrontの構成はamplifyによって行われたため、理論的には機能するはずです。

Cloudfront:

  • 元のドメイン名またはパス:quasar-demo-hosting-bucket-dev.s3-eu-central-1.amazonaws.com(元々はeu-central-1なしでしたが、機能しなかったため手動で追加しました)。
  • 発信元ID:hostingS3Bucket
  • 元のタイプ:S3 Origin

S3バケットポリシー:

{
    "Version": "2012-10-17",
    "Id": "MyPolicy",
    "Statement": [
        {
            "Sid": "APIReadForGetBucketObjects",
            "Effect": "Allow",
            "Principal": {
                "AWS": "arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity ********"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::quasar-demo-hosting-bucket-dev/*"
        }
    ]
}

調査の結果、Cloudfrontが他の地域のS3バケットにアクセスするときに一時的な問題が発生する可能性があることがわかりました。しかし、CloudfrontでOriginに手動で領域を追加し、24時間待機しました。それでも「アクセス拒否」が表示されます。

これは、S3バケットがデフォルトのus-east-1リージョンにないことと関係があると考えられ、その場合はCloudfrontを正しく設定しないことを増幅します。

S3バケットとCloudfrontを正しく設定して、Cloudfront URLを介してウェブサイトにアクセスできるようにするには、どのようにして増幅を取得できますか?

2
morgler

追加情報をありがとう。

S3バケットポリシーは問題ありません。

  • Origin Domain name or Pathについては、常にS3バケットがドロップダウンに表示されるため、regionで更新する必要はありません。

  • ただし、Cloudfront Originには1つの設定がありません。
    Restrict Bucket accessからYesを選択する必要があります

    AWS documentationによる
    ユーザーが常にAmazon S3 URLではなくCloudFront URLを使用してAmazon S3コンテンツにアクセスする必要がある場合は、[はい]をクリックします。これは、署名付きURLまたは署名付きCookieを使用してコンテンツへのアクセスを制限する場合に役立ちます。ヘルプで、「CloudFrontを介したプライベートコンテンツの提供」を参照してください

  • new Identityまたはselect Existing Identityを作成します

  • [作成]ボタンをクリックして、Originを保存します。

enter image description here

4
Raj Paliwal

最初の解決策が機能しない人のために、javascript.config.DistributionDirあなたのproject-config.jsonファイルが正しく構成されています。また、AccessDeniedエラーが発生する可能性もあります(私は今、難しい方法を学んだばかりです)。

Amplifyは、アプリのエントリポイント(index.html)が、設定したディレクトリ内の最初のレベルにあると想定しています。したがって、amplifyのデフォルト構成(dist)を受け入れ、ビルドされたファイルを階層のより深いレベルに配置するプロジェクト(dist/<project name> angular 8)の場合、発行後に403 AccessDeniedエラーとして表示されます。これは、増幅オプションとs3ホスティングオプションの両方に当てはまります。

docs: https://docs.aws.Amazon.com/amplify/latest/userguide/manual-deploys.html (最後を参照)

4
Nathan Hanna