搭配Firebase Auth使用SvelteKit时，身份验证信息的最佳存储位置是？

你当前用writable store存储身份验证状态的大方向完全正确，针对你使用static adapter、后端走Firebase Cloud Functions的场景，只需要做少量优化就能解决遇到的SSR问题，以下是具体方案：

1. 解决SSR状态不匹配问题 #

你遇到的偶发SSR问题，本质是因为SSR阶段服务端无法获取客户端的Firebase Auth状态，渲染出来的静态内容和客户端hydrate时的实际登录状态不一致导致的。
因为你没有用到SvelteKit的服务端能力，直接在根__layout.svelte的context="module"块中关闭SSR即可，完全规避这个问题：

<script context="module">
  // 全应用关闭SSR，纯客户端渲染，适配static adapter场景
  export const ssr = false
</script>

不需要用context="module"替代onMount，onAuthStateChanged本身就是仅客户端需要运行的逻辑，放在onMount中是完全合理的。如果把Firebase Auth相关逻辑放在context="module中，反而会在服务端执行时因为不存在window对象报错。

2. 优化auth store避免登录状态闪屏 #

Firebase Auth本身已经会在客户端本地持久化用户凭证，你可以在store初始化时优先读取本地已有的登录状态，避免页面刷新时瞬间出现未登录的闪屏问题：

import { writable } from 'svelte/store'
import type firebase from 'firebase/auth'
import { auth } from './你的firebase初始化文件路径'

const initialState = {
  isLoggedIn: false,
  user: undefined
}

// 仅在客户端环境初始化时读取已有的登录状态
if (typeof window !== 'undefined') {
  const currentUser = auth.currentUser
  if (currentUser) {
    initialState.isLoggedIn = true
    initialState.user = currentUser
  }
}

const authStore = writable<{
    isLoggedIn: boolean,
    user?: firebase.UserInfo
}>(initialState)

3. 权限管控的最佳实践 #

• 客户端侧：直接在需要鉴权的页面、组件内订阅authStore，根据状态做UI展示控制或者路由跳转即可，跨页面状态维持由Svelte store和Firebase Auth本地持久化共同保障，不需要额外处理。
• 服务端侧：所有Firebase Cloud Functions接口必须单独做身份校验，不要信任客户端传递的用户身份，使用Firebase Admin SDK验证请求携带的ID token，客户端的鉴权仅用于优化用户体验，服务端校验才是安全的核心保障。

内容的提问来源于stack exchange，提问作者Chaddeus