Firestore 数据库未定义答案

【问题标题】：Firestore db is not definedFirestore 数据库未定义
【发布时间】：2021-09-07 13:39:57
【问题描述】：

所以我正在尝试创建一个简单的表单 Web 应用程序，用户可以在其中填写详细信息并单击它应该保存在 Firestore 中但无法正确初始化 Firestore 当我尝试运行该函数时它说 db 未定义这里是我的代码

HTML

<html lang="en">
<head>
  <link rel="stylesheet" href="index.css">
  <script src="https://www.gstatic.com/firebasejs/7.9.1/firebase-app.js"></script> 
  <script src="https://www.gstatic.com/firebasejs/7.9.1/firebase-analytics.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script> 
  <title>Title</title>
</head>
<body>
  <div id="background" class="main_card">
    <div id="main" class="main_content" style="display: none">
      <div class ="info">
        <h1 class="h1">H1</h1>
        <h2 class="h2">H2</h2>
        <h1 class="h1">Name and Name</h1>
          <p class= "line p">________________________________________</p>
          <h2 class="h2">The Details</h2>
          <p class="p">Date</p>
          <p class="p">Time</p>
          <br>
          <h2 class="h2">Random text</h2>
          <p class="p">Random text</p>
          <p class="p">Address</p>
          <p class= "line p">________________________________________</p>
        <input id="namefield" type="text" placeholder="Name" required>
        <input id="numberfield" type="number" placeholder="No of Guests" required>
      </div>
      <button class ="regret">Regret</button>
      <button class ="accept" onclick="WriteData();">Accept</button>//Here the function calls the JS function

  </div>
  
<script> 
  // Your web app's Firebase configuration 
  var config = {
      apiKey: "My API KEY",
      authDomain: "DOMAIN",
      projectId: "PROJECT ID",
      storageBucket: "storageBucket",
      messagingSenderId: "messagingSenderId",
      appId: "appId",
      measurementId: "G-measurementId"
  };
  // Initialize Firebase 
  firebase.initializeApp(config); 
  firebase.analytics();
  const db = firebase.firestore(); 

  db.settings({ timestampsInSnapshot: true });
</script>

<script src="backend.js"></script>
  
</body>

</html>

后端.js

function WriteData(){
  
  var name = document.getElementById("namefield").value;
  var people = document.getElementById("numberfield").value;
  db.collection('RSVP').add({ // The error arises here "db is not defined"
    name: name, 
    people: people,
  }).then((docref) => { console.log("Document writted with ID: ", docref.id);}).catch((error) => { console.log("Error adding document: ", error);

  }); 
}

希望这些是必要的信息。

新错误

在 'https://firestore.googleapis.com/google.firestore.v1.Firestore/Write/channel?database=projects%2Frsvp-for-tipsy-and-ixy%2Fdatabases%2F（默认）访问 XMLHttpRequest &VER=8&RID=65860&CVER=22&X-HTTP-Session-Id=gsessionid&%24httpHeaders=X-Goog-Api-Client%3Agl-js%2F%20fire%2F8.6.1%0D%0AContent-Type%3Atext%2Fplain%0D% 0AX-Firebase-GMPID%3A1%3A321206967611%3Aweb%3Adbefee0e935d6e0931ab1e%0D%0A&zx=q0x6d2syb2od&t=1' 来自来源 'http://127.0.0.1:5500' 已被 CORS 策略阻止：'Access-Control-Allow- Origin' 标头的值 'https://127.0.0.1:5500' 不等于提供的来源。

【问题讨论】：

标签： javascript html firebase google-cloud-firestore

【解决方案1】：

您需要对齐 Firebase 库的版本号：

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

应改为

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

看到它们都指向版本 8.6.1。

请注意，它不是 JS SDK v8 的最新版本。见https://firebase.google.com/support/release-notes/js

【讨论】：

很抱歉您的回答对我有所帮助。我已经做了一些更改，现在它可以工作了，但我有一个新的错误，我已经编辑了问题
如果您尝试将应用部署到 Firebase 托管会发生什么？
是的，现在它可以工作了