Amplifyの勉強で得たことを詰まってることを書きます
認証済みも未認証のユーザーもどちらも特定のテーブルにはアクセスできるけど、未認証はテーブルのアイテムの作成はできないみたいなことがしたい。
ぱっと調べた感じだとこれでいけるのか?
とりあえずこんな感じで認証を追加し直して、IAMのロールをいい感じに編集したらできました!
上記の未認証と認証ユーザーの要件をクリアしたうえでAmplifyのホスティングを使ったときにちょっと詰まったので記録します。
まず未認証と認証の機能を実装するときに aws-exports.js に変更を加えています。
デプロイ方法はGithubからリポジトリとそのブランチをしていする方法を使用しました。
このままデプロイしてもビルドしたあとのファイルの場所が間違っているのでビルド設定を編集します。
Nuxtを使用しているのでビルド後のファイル出力先は /dist
になるので
artifacts:
baseDirectory: /dist
というふうに変更します。
変更後ビルドし直すと、無事にフロント部分は正しく表示されました。
ですが、AppSyncのGraphqlがで動作していないことに気づきました。
その原因としてAuthが正しくIAMの設定ができていないことが原因だとわかりました。
AuthにIAMを使用するには、aws-exports.js
を編集することで使用できます。
基本的にこのファイルはamplifyがわで生成するものなので、初期ではgitignoreに登録されています。
ですが今回は変更を加えているのを使用したいので、gitigonoreからaws-exports
を削除します。
そしてもう一度ビルドしたのですが、うまく行きませんでした。
原因はビルド設定の
backend:
phases:
build:
commands:
- '# Execute Amplify CLI with the helper script'
- amplifyPush --simple
amplifyPush --simple
でした。
このコマンドによってaws-exports
が上書きされてしまっていたのです。
このコマンドを削除し、再びビルドしたらやっとAppsyncのGraphqlが動作しました。
amplifyでNuxtをSPAモードでホスティングしている状態で、
最初にアクセスしたURLが https://[branch].xxxxxxxxxx.amplifyapp.com
だと、なにもエラーにはならないが、
最初にアクセスしたURLが https://[branch].xxxxxxxxxx.amplifyapp.com/hoge
とかだとAccess Denied エラー (403) になる。
これの解決方法は、
このサイトを参考にさせてもらいました。
原因とかは上のサイトを参照してください。
解決策として、
このようにリダイレクト先をしていすると正しく動作します