无法从Firebase数据库Node.js / JavaScript获取数据
大家早上好,我对Firebase作为一个新用户有点麻烦。 在我之前的问题中,我问过如何使用我的快速服务器进行API调用,将检索到的数据传递到我的Firebase数据库中,并且能够使其工作! 但是,现在我想从我的数据库中获取数据,并使用它在客户端填充我的DOM。
所以我们清楚这是如何工作stream程得到我的应用程序去:
- 从我的客户端向我的快速应用
app.js
发送一个AJAX请求,发送一个小型数据对象{search: search}
,其中在客户端的窗体中捕获search的值。 (作品) - 获取该数据对象,并向第三方API发出另一个AJAX请求,该API返回另一个数据对象。 (作品)
- 从第三方API获取该响应对象,并将其发送到我的数据库。 (作品)
- 脚本客户端从我的数据库中提取信息来填充DOM。 (不工作)
看着无数的教程是艰难的,我遵循指南,我发现完全使用一些罚款面食,但我仍然卡住。
这里是我用来从我的数据库中检索数据的客户端脚本firebaseData.js
,我试图在端点[my database url]/user
获取所有的数据:
$(document).ready(function() { // create object instance of my Firebase database var myDBReference = new Firebase([my database url]); console.log(myDBReference.child("user")) });
它在控制台客户端返回:
X {k: Ji, path: P, n: Ce, pc: false, then: undefined…}
这就是我所能得到的。 下面是我的index.html,其中我链接到firebase的CDN和一堆其他的东西,我只是被告知包括在我的项目中:
<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="main.css"> </head> <body> <div id="top"> <h1>Just Trying to Make a Halo App</h1> <form id="searchForm"> <input id="searchField" type="text"></input> <input id="searchButton" type="submit" value="search"></input> </form> </div> <div id="imageContainer"> <img id="emblem"> <img id="spartan"> </div> <div id="dataContainer"> <h2></h2> <p></p> </div> <script src="https://www.gstatic.com/firebasejs/live/3.0/firebase.js"></script> <script> // Initialize Firebase var config = { apiKey: "[my key value]", authDomain: "[authDomain value]", databaseURL: "[databaseURL value]", storageBucket: "[storageBucket value", }; firebase.initializeApp(config); </script> <script src="https://cdn.firebase.com/js/client/2.4.2/firebase.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script> <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> <script type="text/javascript" src="request.js"></script> <script type="text/javascript" src="firebaseData.js"></script> </body> </html>
实际上, var config
对象具有从Firebase控制台生成的所有正确信息 – 我希望这就是我需要解决的一切! 请让我知道,如果您需要更多的信息,我会很乐意提供,并感谢您花时间检查我的问题。
快乐星期六!
myDBReference.child("user")
只是数据存储位置的参考。 要实际检索数据,您需要使用.on()
或.once()
。 我强烈build议您花一些时间阅读Firebase文档以检索数据 。
firebase.database().ref().child("user").once('value', function(snapshot) { if(snapshot.value()){ //logs everything that is under /user console.log(snapshot.value()); } });
请记住,如果在/root/user
下有许多/root/user
,那么在检索完整个分支之后,需要使用以下代码对它们进行迭代:
snapshot.forEach(function(childSnap){ console.log(childSnap.val()); });
更新:
由于我看到你没有使用Angular等任何SPA框架(使用angularfire ),如果你想显示你从firebase中获取的数据,你将需要设置一个元素id,然后调用document.getElementById()
你的callback来操纵它。
<p id="username"></p> document.getElementById("username").value = snapshot.val();