Лучшее место для хранения информации об аутентификации в SvelteKit с помощью Firebase Auth?

#svelte #sveltekit

Вопрос:

Я новичок в SvelteKit и хочу убедиться, что не упускаю чего-то очевидного. Где лучше всего хранить статус аутентификации, чтобы я мог эффективно предоставлять/блокировать доступ к частям своего приложения с помощью Firebase Auth?

Прямо сейчас я храню его в хранилище, доступном для записи. Вот так:

 import { writable } from 'svelte/store' import type firebase from 'firebase/auth'  const authStore = writablelt;{  isLoggedIn: boolean,  user?: firebase.UserInfo }gt;({  isLoggedIn: false })  

А затем в __layout.svelte я использую его так:

 onMount(() =gt; {  onAuthStateChanged(auth, (user) =gt; {  authStore.set({  isLoggedIn: user != null,  user  })  }) })  

Я должен добавить, что я использую статический адаптер, так как весь мой «серверный» код будет находиться в облачных функциях Firebase и не будет использовать конечные точки.

Но иногда во время разработки я сталкиваюсь с проблемами SSR… Я не уверен, могу ли я (или должен) использовать context=»модуль» поверх onMount и т. Д.

Документы Svelte и SvelteKit удивительны, но не вникайте в сценарии-например, в лучшие методы поддержания аутентификации на страницах и т. Д.

Кроме того, до сих пор SvelteKit Firebase была фантастической платформой для работы.

Ответ №1:

Обычно я оборачиваю свои клиентские материалы дополнительной проверкой браузера. Это помогает при проблемах с БСО.

 import {browser} from '$app/env'; if (browser){  onMount(() =gt; {  onAuthStateChanged(auth, (user) =gt; {  authStore.set({  isLoggedIn: user != null,  user  })  })  }) }  

Я также заметил, что событие Firebase onAuthStateChanged часто срабатывает дважды при изменении состояния аутентификации, что несколько сбивает с толку. Это обсуждается в разных местах, если вы ищете «firebase onauthstatechanged запускается дважды». Это не полностью отвечает на ваш вопрос, но, надеюсь, сэкономит вам некоторое время.