Estoy tratando de crear un proyecto usando JavaScript y una base de datos en tiempo real de Firebase. Ahora quiero enumerar los datos de la base de datos en la página. Pero no puedo probar mi código porque me sale este error:
TypeError no detectado: firebase.database no es una función en index.html:69
Mi código en la línea 69:
const issuesRef = firebase.database().ref('student/');Y este es mi código completo:
<!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>Project</title> </head> <body> <button id="Insbtn">List items</button> <script src="https://cdnjs.cloudflare.com/ajax/libs/firebase/8.2.2/firebase-app.js"> </script> <script type="module"> // Import the functions you need from the SDKs you need import { initializeApp } from "https://www.gstatic.com/firebasejs/9.1.0/firebase-app.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 const firebaseConfig = { apiKey: "...", authDomain: "...", databaseURL: "...", projectId: "...", storageBucket: "...", messagingSenderId: "...", appId: "..." }; // Initialize Firebase const app = initializeApp(firebaseConfig); import { getDatabase, ref, set, child, update, remove, onValue } from "https://www.gstatic.com/firebasejs/9.1.0/firebase-database.js"; const db = getDatabase(); const issuesRef = firebase.database().ref('student/'); function readIssues() { issuesRef.on("value", function(snapshot) { snapshot.forEach(snap => { const issue = snap.val(); console.log(issue.NameOfStd); }) } )} var insBtn = document.getElementById("Insbtn"); insBtn.addEventListener('click', readIssues); </script> </body> </html>Está usando el SDK modular nuevo, pero está usando una sintaxis de espacio de nombres más antigua para crear una referencia de base de datos y escucharla. Intente refactorizar el código como se muestra a continuación:
import { getDatabase, ref, set, child, update, remove, onValue } from "https://www.gstatic.com/firebasejs/9.1.0/firebase-database.js"; const db = getDatabase(); const issuesRef = ref(db, 'student'); function readIssues() { onValue(issuesRef, (snapshot) => { snapshot.forEach(snap => { const issue = snap.val(); console.log(issue.NameOfStd); }) });La documentación tiene ejemplos de sintaxis funcional y con espacio de nombres.