VueJS と firebase: ページの更新後にユーザーがログインしているかどうかを確認する

Question

Vue 3 と firebase フレームワークを使用して Web アプリケーションを開発しています。ストレとしてはピニアを使っています。認証には firebase を使用していますが、これまでのところうまく機能しており、ユーザーは登録してログインできます。ユーザーがログインすると、そのデータは pinia ストレージに保存されます。

ただし、ユーザーがログインしてページをリロードすると、pinia ストレージ内のデータは失われます。 Firebase 関数 onAuthStateChanged() を使用すると、ユーザーはログインしたままになります。

私の最初の解決策は、アプリが起動され、pinia ストアに必要なデータが設定されるたびに onAuthStateChanged() 関数を呼び出すことでした。 Firebase 設定ファイルで onAuthStateChanged() 関数を呼び出そうとしましたが、そこでは pinia ストアがまだ初期化されていません。

更新後にユーザーが自動的にログインし、ユーザー データを Pinia ストレージに書き込むことができるようにするには、Vue アプリケーションのどの時点で onAuthStateChanged() 関数を呼び出す必要がありますか? ?

Answer 1

あなたが何を試したのかわかりませんが、これがうまくいくことはわかっています。もちろん、onAuthStateChanged をストアの外に移動しても、引き続き機能します。 store.user を追跡し、UI を更新するには、オブザーバーまたは計算された props を使用する必要があることに注意してください。

リーリー