angularjs - ng-file-upload + acl: public-read (angular + firebase + Aws S3 app) acl:private アップロードを使用したアップロードでの 403 エラー

Question

シナリオ：

開発サイトのブログ機能 (angular + firebase + Aws S3 + ng-file-upload )

画像を S3 にアップロードして保存し、URL を firebase に保存して、ブログ投稿がレンダリングされたときに呼び出されるようにする

問題 -

• アップロード時に 403 エラー アクセスが拒否されました - リクエスト ヘッダーの acl が「public-read」の場合
• 「非公開」作品 - アップロードするが、ページには表示しないことを意味します

(* ただし、画像を手動で変更して Aws S3 バケットで一般公開すると、画像はブログでレンダリングされます*) - 問題がどこにあるのかを把握するために輪になっていきます

ここにコードがあります

// ポリシー ドキュメント

 $scope.policy = {
"expiration": "2020-01-01T00:00:00Z",
"conditions": [
  {"bucket": "my-bucket-name"},
  ["starts-with", "$key", ""],
  {"acl": 'public-read'},
  {"success_action_redirect":"#"},
  ["starts-with", "$Content-Type", ""],
  ["starts-with", "$filename", ""],
  ["content-length-range", 0, 524288000]
  ]
};

// Upload method and parameters

Upload.upload({
  url: 'https://my-bucket-name.s3.amazonaws.com/',
  method: 'POST',
  fields: {
    key: file.name,
    AWSAccessKeyId: 'MY-ACCESS-KEY,
    acl: 'public-read',
    success_action_redirect: "#",
    policy: myPolicy, // Base64 encoded
    signature: mySignature,
    "Content-Type": file.type != '' ? file.type : 'application/octet-stream',
    filename: file.name
  },
  file: file
})

// Cors 
`<?xml version="1.0" encoding="UTF-8"?>`
` <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">`
   ` <CORSRule>`
        `<AllowedOrigin>*</AllowedOrigin>`
       ` <AllowedMethod>GET</AllowedMethod>`
        `<AllowedMethod>POST</AllowedMethod>`
       ` <AllowedMethod>HEAD</AllowedMethod>`
        `<MaxAgeSeconds>3000</MaxAgeSeconds>`
       ` <AllowedHeader>*</AllowedHeader>`
   ` </CORSRule>`
`</CORSConfiguration>`

// Bucket Policy
{
"Version": "2012-10-17",
"Statement": [
    {
        "Sid": "UploadFile",
        "Effect": "Allow",
        "Principal": {
            "AWS": "arn:aws:iam::MY-ID:user/MY-USERNAME"
        },
        "Action": [
            "s3:GetObject",
            "s3:PutObject"
        ],
        "Resource": "arn:aws:s3:::my-bucket-name/*"
    },
    {
        "Sid": "crossdomainAccess",
        "Effect": "Allow",
        "Principal": "*",    // there is asterik here just not showing up in this comment 
        "Action": "s3:GetObject",
        "Resource": "arn:aws:s3:::my-bucket-name/crossdomain.xml"
    }
]
}