Recursion-Group-P / blokee

https://blockee.netlify.app
3 stars 0 forks source link

feat/pages/Home #1

Closed tkwonn closed 2 years ago

tkwonn commented 2 years ago

こちらのリポジトリでForm認証の例を作成していますが、Googleアカウントを使用した認証方法でも構いません。 https://github.com/Recursion-Group-P/Quasar/tree/auth

firebaseの関数やConfigはQuasarだとBoot fileに書くみたいです。 このBoot fileは独自の依存関係(ライブラリやVueコンポーネントなど)を指定したりスタートアップコードを書く場所らしいです。 詳しくは以下のリンクを参考にしてみてください。 https://v1.quasar.dev/quasar-cli/boot-files#introduction

Firebaseでのログイン機能は実装したことがあるみたいなので、わかるかと思いますが、以下のリンクもよろしければ参考にしてみてください(Googleアカウントでの認証では必要のない処理もあるかもしれませんが。。)

Firebaseの初期化とアプリとの連携について https://firebase.google.com/docs/web/setup

QuasarリポジトリのAuthブランチのsrc/store/store-auth.jsを見るとVuexのようにログイン情報をFirebase側に送っているのがわかるかと思います。 JavascriptのWeb APIを使用します(バージョンはhirotoさんがやりやすい方で大丈夫です) https://firebase.google.com/docs/reference

ログイン状態をローカルストレージに保存 https://v1.quasar.dev/quasar-plugins/web-storage#localstorage-api

ログインしているユーザにだけ他のページに遷移させる(ナビゲーションガード) こちらもBoot fileにて先に指定します(Authブランチを参考にしてみてください)

https://router.vuejs.org/guide/advanced/navigation-guards.html ログアウトしたらホームページへリダイレクトなどの処理も https://firebase.google.com/docs/reference/js/v8/firebase.auth.Auth#onauthstatechanged