I'm not able to pass the UID that I get from pushing data to my firebase db, to other javascript files
Question
I'm building an app that requires me to keep track of the current UID that I get once a user pushes data to firebase. I do this by using the .push method and a unique key is generated and placed in my db for the records associated to that. This is what I'm considering my UID. I created a global variable in my javascript file, set the global var to the UID that is being generated and am simply trying to console.log(UID) in a seperate javascript file where I need access to the current UID. However, every time I try to log in the other js file, I get UID = undefined. Pretty sure I called my files properly in the html script tags and have tried putting them both in the head tags and in the body but still getting errors..
//Form.js file where I get the UID var UID; //global var $(document).ready(function(){ var postData = function(){ var firebaseRef = firebase.database().ref(); ...//create json object testData ...//create json object testData firebaseRef.push(testData).then((snap) => { UID = snap.key; //the unique key is my UID console.log("this is the UID", UID) //logs }); }; //-------------------------- //Feed.js File $(document).ready(function(){ console.log("uid =", UID); //returns uid = undefined });
<!DOCTYPE html> <html> <head> ... </head> <body> <script src="javascripts/form.js"></script> <script src="javascripts/feed.js"></script> </body> </html>
3 answers
solution1
0 2017-09-14 15:35:40
This is likely because the push({data}) is equal to push().set({data}) . Set() is async and returns a Promise. Because it is async you cannot know if the UID is already there when you make the console log. in this case, because the async function has not resolved, UID is not set at the time of the console.log and you get undefined.
One Solution:
Im just gonna name ur global getUID
var = getUID; $(document).ready(function(){ var firebaseRef = firebase.database().ref(); ...//create json object testData getUID = firebaseRef.push(testData); })
This will make UID a Promise. Then in feed.js you put:
getUID.then((snap) => {console.log("uid =", snap.key) + rest of your code that uses uid})
You can also know the key beforehand by just calling UID = firebaseRef.push() (push() itself is synchronous) and then call firebaseRef.set(data). But mind that in this case you cannot be certain that the data was succesfully uploaded to firebase.
More about promises: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises
It works with a mock promise, after 3 secs you get the console log:
var getUID; $(document).ready(function(){ getUID = new Promise (function (resolve){ setTimeout(function(){ resolve("Hello world"); }, 3000); }); }) $(document).ready(function(){ getUID.then(function(value) {console.log(value)}) })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
solution2
0 2017-09-15 02:10:07
try this way.
var UID;
$(document).ready(function(){
UID= firebaseRef.push().key;
firebaseRef.child(UID).set(testData);
});
$(document).ready(function(){
console.log(UID) //put a debugger in the console and check which document.ready called first.
});
Your problem occurs in the document.ready function because you have two of them at once, firebase.set is async call as so as soon you call them it doesn't wait for the "then" method to execute, it switches to the other statement (ie your another document.ready and prints the console.log(UID), then when the set is done it switches back to the "then" method and then assigns the key to the UID.
solution3
0 2017-09-15 21:32:59
编辑：使用本地存储跨不同的.js文件传递值
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.