Firebase 实时数据库 CRUD 问题

Question

按下插入按钮时，Firebase 不会更新。 我正在使用 Firebase 处理 CRUD，但似乎无法通过这一步。 我还收到一条错误消息，指出无法加载资源：服务器响应状态为 404 ()我想确定它是我正在使用的 CDN，还是导入不正确。 有什么建议吗？

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>CRUD Firebase JS</title>
    <style>
      label {
        display: inline-block;
        width: 80px;
      }
      input,
      select {
        width: 120px;
      }
    </style>
  </head>
  <body>
    <label>Name</label>
    <input id="namebox" type="text" name="name" /><br /><br />
    <label>Roll No</label>
    <input id="rollbox" type="text" name="roll" /><br /><br />
    <label>Section</label>
    <input id="secbox" type="text" name="section" /><br /><br />
    <label>Gender</label>
    <select id="Genbox">
      <option value="Male">Male</option>
      <option value="Female">Female</option>
    </select>
    <hr />
    <button id="insBtn">INSERT</button>
    <button id="selBtn">SELECT</button>
    <button id="updBtn">UPDATE</button>
    <button id="delBtn">DELETE</button>

    <script type="module">
      // Import the functions you need from the SDKs you need
      import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.6.3/firebase-app.js';
      import { getAnalytics } from 'https://www.gstatic.com/firebasejs/9.6.3/firebase-analytics.js';
      // TODO: Add SDKs for Firebase products that you want to use
      // https://firebase.google.com/docs/web/setup#available-libraries

      // Your web app's Firebase configuration
      // For Firebase JS SDK v7.20.0 and later, measurementId is optional
      const firebaseConfig = {
        apiKey: 'APIKEY IS HERE', // <----The real API key is here
        authDomain: '******.firebaseapp.com',
        databaseURL: 'https://***_***_***.firebaseio.com',
        projectId: 'fir-js-****',
        storageBucket: 'fir-js-*****.appspot.com',
        messagingSenderId: '483****844',
        appId: '************************',
        measurementId: 'G-********',
      };

      // Initialize Firebase
      const app = initializeApp(firebaseConfig);
      const analytics = getAnalytics(app);

      import {
        getDatabase,
        ref,
        set,
        child,
        update,
        remove,
      } from 'https://www.gstatic.com/firebasejs/9.6.3/database.js';
      const db = getDatabase();

      //----------------------------------------References---------------------------------------//
      let namebox = document.getElementById('Namebox');
      let rollbox = document.getElementById('Rollbox');
      let secbox = document.getElementById('Secbox');
      let genbox = document.getElementById('Genbox');

      let insBtn = document.getElementById('insBtn');
      let selBtn = document.getElementById('selBtn');
      let updBtn = document.getElementById('updBtn');
      let delbtn = document.getElementById('delBtn');

      //----------------------------------------Insert---------------------------------------//

      function InsertData() {
        set(ref(db, 'TheStudents/' + rollbox.value), {
          NameOfStd: namebox.value,
          RollNo: rollbox.value,
          Section: secbox.value,
          Gender: genbox.value,
        })
          .then(() => {
            alert('data stored successfully');
          })
          .catch((error) => {
            alert('unsuccessful, error' + error);
          });
      }

      //----------------------Assign Event Listener to the button----------------------//
      insBtn.addEventListener('click', InsertData);
    </script>
  </body>
</html>

Answer 1

问题是你的数据库url。它似乎不正确。它应该是：

gstatic.com/firebasejs/9.6.3/firebase-database.js 。

还要仔细检查您的 ID。

Firebase 实时数据库 CRUD 问题

问题描述

1 个解决方案

解决方案1
0 2022-11-16 00:42:19

Firebase 实时数据库 CRUD 问题

问题描述

1 个解决方案

解决方案1 0 2022-11-16 00:42:19

解决方案1
0 2022-11-16 00:42:19