Firestore运行提示db未定义及后续CORS跨域问题求助

一、db is not defined报错修复 #

导致该错误的核心原因是Firebase SDK版本不匹配、作用域访问限制，按以下步骤修改即可：

• 统一所有Firebase SDK的版本，禁止跨版本混用。将HTML头部的三个SDK引用替换为同版本资源，示例如下：

<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js"></script> 
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.10.0/firebase-firestore.js"></script> 

• 将db变量显式挂载到全局作用域，避免块级作用域导致的外部脚本无法访问问题，修改HTML内的初始化代码：

// 初始化Firebase
firebase.initializeApp(config); 
firebase.analytics();
// 挂载到window全局对象，确保backend.js可以访问
window.db = firebase.firestore(); 
// 8.x版本timestampsInSnapshots配置已默认生效，可直接删除该行
// db.settings({ timestampsInSnapshots: true });

二、CORS跨域报错修复 #

报错的核心原因是本地访问协议与Firebase授权的域名协议不一致，你当前用http://127.0.0.1:5500访问，但Firebase后台只授权了https://127.0.0.1:5500，按以下步骤修改：

• 进入Firebase控制台→Authentication→设置→授权域名，添加http://127.0.0.1:5500到授权列表，删除错误的https://127.0.0.1:5500条目。
• 本地开发阶段直接使用编辑器本地服务（如VS Code Live Server）生成的http地址访问即可，不要手动修改地址协议为https。
• 若仍有访问权限问题，可先将Firestore安全规则调整为临时测试模式，验证功能正常后再修改为正式规则，测试规则参考：

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if request.time < timestamp.date(2024, 12, 31);
    }
  }
}

注意：测试规则仅用于本地开发验证，上线前必须调整为符合业务需求的安全规则，避免数据泄露或恶意篡改。

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