求助：SvelteKit+Firebase谷歌认证在Safari出现Fetch API跨域错误

常见排查和修复步骤 #

1. 确认Firebase授权域配置 #

先打开Firebase控制台，进入Authentication > 设置 > 授权域，把你的SvelteKit应用所有环境的域名都加进去——包括本地开发的http://localhost:5173，还有线上的正式域名。Safari对跨域的校验比Chrome严得多，漏加域名直接触发这个错误。

2. 把Firebase初始化限制在客户端 #

SvelteKit的SSR（服务器端渲染）可能让Firebase在非浏览器环境初始化，Safari的Fetch API对这种情况的跨域限制特别敏感。你可以把初始化逻辑放在仅客户端执行的代码块里：

// lib/firebase.js
import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';

let app;
let auth;

// 只在浏览器环境初始化
if (typeof window !== 'undefined') {
  const firebaseConfig = {
    // 你的Firebase配置信息
  };
  app = initializeApp(firebaseConfig);
  auth = getAuth(app);
}

export { auth };

3. 处理Safari的第三方Cookie限制 #

Safari默认会阻止第三方Cookie，而Firebase认证靠Cookie存会话信息，这大概率是核心问题：

• 去Firebase控制台的身份验证 > 设置 > 会话管理，开启「使用HTTP-only Cookie」选项
• 确保你的应用用HTTPS部署，本地开发可以用vite --https启动服务
• 如果用Firebase Hosting，一定要绑定自定义域名并配置HTTPS，别用默认的firebaseapp.com域名——Safari对这类通用域名的第三方Cookie限制更苛刻

4. 检查Fetch请求的模式设置 #

如果手动调用过Firebase的API，确认Fetch请求的mode是'cors'（虽然默认就是，但有时候框架会偷偷改）：

fetch('https://identitytoolkit.googleapis.com/v1/accounts:signInWithIdp', {
  method: 'POST',
  mode: 'cors',
  // 其他请求参数
});

5. 清掉Safari的缓存和Cookie #

有时候旧缓存或过期Cookie会搞垮跨域校验，试试：

• 桌面Safari：偏好设置 > 隐私 > 管理网站数据 > 删除你的应用域名相关数据
• 移动端Safari：设置 > Safari浏览器 > 清除历史记录与网站数据

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