質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.51%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

Q&A

解決済

1回答

7474閲覧

AWS S3のアップロードでAccess Deniedになる

r-kurokw

総合スコア14

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

AWS(Amazon Web Services)

Amazon Web Services (AWS)は、仮想空間を機軸とした、クラスター状のコンピュータ・ネットワーク・データベース・ストーレッジ・サポートツールをAWSというインフラから提供する商用サービスです。

0グッド

0クリップ

投稿2018/05/07 05:43

編集2018/05/09 06:22

実現したいこと

AWS Cognitoで認証されたユーザにS3の画像のアップロード, 閲覧, 及び削除権限を与えたい。

現状

以下のプログラムを作成しましたが、アクセス権限がないと怒られます。

Javascript

1AWS.config.region = region; 2AWS.config.update({ 3 credentials: new AWS.CognitoIdentityCredentials({ 4 RoleArn: "arn:aws:iam::[Account ID]:role/[Role name]", 5 IdentityPoolId: [Cognito IdentityPoolId] 6 }) 7}); 8var bucket = new AWS.S3({ 9 params: { 10 Bucket: [Bucket name] 11 } 12}); 13var params = { 14 Key: [File name], 15 ContentType: [File type], 16 Body: [File] 17}; 18bucket.putObject(params, function(err, data) { 19 if (err) console.log(err); 20 else console.log(data); 21});

エラー内容は以下の通りです。

エラー内容

1回目の実行では、
Missing credential in config
というエラーが出て、2回目以降では、
Access Denied
というエラーが出る挙動も何か関係しているのでしょうか?

原因の可能性としては、

  • IAMロールの設定が間違っている
  • コードに誤りがある

のどちらかにあると思うのですが、ご教授いただけませんでしょうか。。。

作業内容

IAMのロールを以下のように設定しました。

{ "Version": "2012-10-17", "Statement": [ { "Sid": "AllowPublicCognitoIdentity", "Effect": "Allow", "Action": [ "cognito-identity:*", "mobileanalytics:PutEvents", "cognito-sync:*" ], "Resource": "*" }, { "Sid": "AllowPublicS3Bucket", "Effect": "Allow", "Action": [ "s3:ListBucket" ], "Resource": [ "arn:aws:s3:::[Bucket name]" ], "Condition": { "StringLike": { "s3:prefix": [ "cognito/[Cognito App name]/" ] } } }, { "Sid": "AllowPublicS3Object", "Effect": "Allow", "Action": [ "s3:GetObject", "s3:PutObject", "s3:DeleteObject", "s3:PutObjectAcl" ], "Resource": [ "arn:aws:s3:::[Bucket name]/cognito/[Cognito App name]/${cognito-identity.amazonaws.com:sub}", "arn:aws:s3:::[Bucket name]/cognito/[Cognito App name]/${cognito-identity.amazonaws.com:sub}/*" ] } ] }

参考にしたページ

Amazon S3: Amazon Cognito ユーザーにバケット内のオブジェクトへのアクセスを許可する
サーバーレスでJavaScript だけで画像ファイルをアップロードする方法

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

lazhuward

2018/05/09 02:18 編集

AWS.config.region = region; この部分はマスキングしてますか?それともコードそのままですか?
r-kurokw

2018/05/09 02:21

ご連絡ありがとうございます!マスキングしております。実際には`ap-northeast-1`を入れております。
lazhuward

2018/05/09 02:41 編集

なるほど。このJSはどこで動かしてますか?AWSのサービスを利用してますか?ローカルならSSLもしくはHTTPポート空いてますか?
r-kurokw

2018/05/09 02:43

JSはブラウザサイドで動かしていますので、AWSのサービスではないです。フレームワークとして、Vue.jsを用いております。
guest

回答1

0

ベストアンサー

AWS.config.update({ credentials: new AWS.CognitoIdentityCredentials({ RoleArn: "arn:aws:iam::[Account ID]:role/[Role name]", IdentityPoolId: [Cognito IdentityPoolId] }) });

RoleArn のところ、Poolとarnが共存しているので不具合が起きているような気がします。
参考にしたページもARN書いて無かったのですが、どこかでROLEARN使っている記事がありましたか?

■FYI
Amazon Cognito » 開発者ガイド
cognitoを使ってログイン画面を作ってみた! 〜ログイン画面作成〜(作業メモ)
Amazon Cognito UserPools を JavaScript から使ってみる

##追記1
IAMポリシーを以下にしてみてください。

{ "Version": "2012-10-17", "Statement": [ { "Sid": "AllowPublicCognitoIdentity", "Effect": "Allow", "Action": [ "cognito-identity:*", "mobileanalytics:PutEvents", "cognito-sync:*" ], "Resource": "*" }, { "Sid": "AllowPublicS3Bucket", "Effect": "Allow", "Action": [ "s3:ListBucket" ], "Resource": [ "arn:aws:s3:::[Bucket name]" ], "Condition": { "StringLike": { "s3:prefix": [ "cognito/[cognito app name]/" ] } } }, { "Sid": "AllowPublicS3Object", "Effect": "Allow", "Action": [ "s3:GetObject", "s3:PutObject", "s3:DeleteObject", "s3:PutObjectAcl" ], "Resource": [ "arn:aws:s3:::[Bucket name]/cognito/[cognito app name]/[folder name]/", "arn:aws:s3:::[Bucket name]/cognito/[cognito app name]/[folder name]/*" ] } ] }

##追記2
Cognito IAMロールのデフォルトポリシー

{ "Version": "2012-10-17", "Statement": [ { "Effect": "Allow", "Action": [ "mobileanalytics:PutEvents", "cognito-sync:*", "cognito-identity:*" ], "Resource": [ "*" ] } ] }

投稿2018/05/09 05:11

編集2018/05/10 02:38
lazhuward

総合スコア1294

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

r-kurokw

2018/05/09 06:17

ご回答いただきありがとうございます! RoleArnは、Cognitoのユーザ認証を受けたユーザのみ、S3のアップロードを可能にするために設定していましたが、IdentityPoolIDを指定することで、そこに紐づけられているロールが適用されるので必要なく、共存してしまっているということでしょうか? また、RoleArnの設定を消して、再度実行してみましたが、エラーは依然として変化しませんでしたm(._.)m
lazhuward

2018/05/09 07:18 編集

ああ、400 bad requestですね。 クレデンシャル情報がうまく通ってないですね。 追記したのでIAMポリシーを変更して変わるか試してもらえますか? 変数も使わずベタ打ちで。 あと、S3側のバケットポリシーはどうなっていますか?
r-kurokw

2018/05/09 07:25

この[folder name]というのは、S3に画像をアップロードする際のフォルダ名という認識で合っていますでしょうか? また、S3側のバケットポリシーは設定しておりません。
lazhuward

2018/05/09 07:31

そうです ${cognito-identity.amazonaws.com:sub} に当たる部分です。 S3バケットポリシーは了解しました。
r-kurokw

2018/05/09 14:20

遅くなりました。 ${cognito-identity.amazonaws.com:sub}の部分を[folder name]に変更すると、「このポリシーはアクセス許可を提供しないいくつかのアクション、リソース、条件の表示を提供します」のようなWarningが出てしまいます。。。
lazhuward

2018/05/10 01:10

あ、すみません。ListObjectじゃなくてListBucketでしたか
lazhuward

2018/05/10 02:35 編集

今のままですと、切り分けができてませんので、CognitoのIAMロールをデフォルトに戻して IAM画面>ロール>該当ロールのリンクを押下>ポリシーのアタッチより S3FullAccessを追加してみてください。
r-kurokw

2018/05/10 04:15

CognitoのIAMを追記2に記載していただいた内容に変更して、そのロールに対してS3FullAccessをアタッチしましたが、エラーは依然として変わりませんでした。。 ということは、コード側に問題があるということでしょうか。。。
r-kurokw

2018/05/10 04:28

すみません、putobjectする際に、ACL: "public-read"を付けていたのですが、これを設定せずにアップロードすると、成功しました。
lazhuward

2018/05/10 06:00

>putobjectする際に、ACL: "public-read"を付けていた 上のソースコードには処理がありませんが、連携している他のソースコードでやっていたってことですか?
r-kurokw

2018/05/10 06:56 編集

そうです。。申し訳ないです。ここから、Cognitoのユーザに限定するように処理を書き換えていこうと思います。ありがとうございます。
lazhuward

2018/05/10 08:56

なるほど。了解しました。AWSはどこが原因なのか突き止めるのが難しいので1つ1つ可能性を潰していくことが一番の近道になります。今回のようにポリシーを一旦S3FullAccesとかにしておくと原因を突き止めるのが早いのでおすすめです。 セキュリティ担保は一番最後にやれば良いので。 ただ、設定したところは忘れないようにしておいてください。
r-kurokw

2018/05/11 05:11 編集

なるほど。今回はすごく助かりましたし、勉強させていただきました。いろいろご教授いただきましてありがとうございました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.51%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問