SvelteKit：如何从服务器端获取Firebase认证状态

核心问题原因 #

Firebase Auth的onAuthStateChanged是客户端专属API，只能在浏览器环境运行，服务器端完全无法触发这个监听逻辑，所以你在+layout.server.ts/+page.server.ts里直接读取客户端的readable store，自然只能拿到初始的null值。另外Auth对象本身包含无法序列化的内部状态，也没法直接从服务器端传递到客户端。

可行简化方案 #

1. 用Firebase ID Token传递认证状态 #

这是最直接的安全方案，无需复杂的session管理：

• 客户端侧：登录成功后，调用getAuth().currentUser.getIdToken()获取ID Token，将其存入SvelteKit的cookies（优先用cookies，因为服务器端可直接读取）。
• 服务器侧：在hooks.server.ts或页面load函数中，从请求cookies取出ID Token，用Firebase Admin SDK的verifyIdToken()验证有效性：

  // hooks.server.ts
  import { adminAuth } from '$lib/server/firebase-admin';
  
  export async function handle({ event, resolve }) {
    const idToken = event.cookies.get('firebase_id_token');
    if (idToken) {
      try {
        const decodedToken = await adminAuth.verifyIdToken(idToken);
        // 将用户信息挂载到event.locals，供后续页面load逻辑使用
        event.locals.user = decodedToken;
      } catch (e) {
        // Token无效时清空cookie
        event.cookies.delete('firebase_id_token');
      }
    }
    return resolve(event);
  }
  

• 页面权限校验：在+layout.server.ts的load函数中检查event.locals.user，未认证则重定向到登录页：

  // +layout.server.ts
  export async function load({ locals, url }) {
    if (!locals.user && url.pathname !== '/login') {
      return {
        status: 302,
        redirect: '/login'
      };
    }
    return { user: locals.user };
  }
  

2. 拆分客户端与服务器端职责 #

客户端的readable store仅负责前端状态同步，服务器端的认证验证必须依赖可传递的凭证（比如ID Token），而非直接访问客户端的状态容器。

3. 独立初始化Firebase Admin #

只在服务器端初始化Firebase Admin，无需和客户端Auth对象交互：

// $lib/server/firebase-admin.ts
import { initializeApp, cert } from 'firebase-admin/app';
import { getAuth } from 'firebase-admin/auth';

const serviceAccount = JSON.parse(process.env.FIREBASE_ADMIN_SERVICE_ACCOUNT || '{}');

const app = initializeApp({
  credential: cert(serviceAccount)
});

export const adminAuth = getAuth(app);

为什么你之前的尝试行不通？ #

• 把Firebase客户端初始化移到服务器端：客户端Auth对象依赖浏览器环境API（如localStorage、IndexedDB），服务器端无法正常初始化，更没法传递给客户端。
• 仅客户端处理认证：服务器端无凭证验证，会导致未授权用户也能请求敏感数据，完全不安全。

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