Firebase: Using the newly created key in the success callback

Question

When a push event happens it will return back a new key.

For example from the Docs:

// Generate a reference to a new location and add some data using push()
var newPostRef = postsRef.push();

// Get the unique ID generated by push()
var postID = newPostRef.key();

What I'm trying to do:

Now I want to use this key directly after in order to effect change in another part of the database.

But because of the asynchronous nature of JavaScript I've been getting tripped up.

I've tried the success callback:

var newMessageIDRef =  firebaseMessagesRef.push({
  authorName: 'Nick',
  text:"Hello!"
},printKey(newMessageIDRef));

var printKey = function(newMessageIDRef) {
  console.log(newMessageIDRef);//undefined
}

(I assume that printKey is being called before newMessageIDRef is set)

I've tried using "then":

var newMessageIDRef =  firebaseConvosRef.push({
    authorName: 'Nick',
    text:"Hello!",
}).then(printKey(newMessageIDRef));

var printKey = function(newMessageIDRef) {
  console.log(newMessageIDRef);//undefined
}

(I assume the parens is causing printKey to be immediately executed, which makes me wonder how I add params but not cause early execution)

Question:

Is there some conventional way to handle something so common or is my best solution to use a Promise and handle the key with resolve?

Update(not answered yet though):

Below is working but it doesn't make sense.

var printKey = function(newMessageIDRef) {
    console.log(newMessageIDRef);//undefined
}

var newMessageIDRef =  firebaseConvosRef.push({
    authorName: 'Nick',
    text:"Hello!",
});
printKey(newMessageIDRef)

I would think that newMessageIDRefwould not necessarily be returned by the time printKey was called.

@Bergi that was just an accident making the snippet, thanks for pointing it out! — Nick Pineda, Nov 06 '15 at 20:26

Roamer-1888 · Answer 1 · 2015-11-06T16:47:37.037

According to the documentation, .push() works as follows :

returns "a Firebase reference for the generated location"
accepts, as second arg, a callback function that "will be called when the specified value is synchronized to the Firebase servers". The callback accepts one parameter, an error object if an error occurred, otherwise null.

Hence, in order to use the returned reference in the callback, it must be assigned, then accessed by the callback as an outer var.

var newMessageIDRef = firebaseMessagesRef.push({
    authorName: 'Nick',
    text:"Hello!"
}, printKey);

var printKey = function(err) {
    if(!err) {
        console.log(newMessageIDRef);
    }
}

Alternatively, you can promisify with one of (at least) two Firebase promisifiers, both of which seem fine but currently lack concrete examples of their promisified .push() in the documentation :

Fireproof

This is an educated guess as to how it might work :

var fireproofMessagesRef = new Fireproof(firebaseMessagesRef);

fireproofMessagesRef.push({
    authorName: 'Nick',
    text:"Hello!"
}).then(successHandler, errorHandler);

function successHandler(childIDRef) {
    console.log(childIDRef);
}
function errorHandler(err) {
    console.error(err);
}

Firebase-promisified

Again, an educated guess :

// having promisified Firebase.
firebaseMessagesRef.promisePush({
    authorName: 'Nick',
    text:"Hello!"
}).then(successHandler, errorHandler);

function successHandler(childIDRef) {
    console.log(childIDRef);
}
function errorHandler(err) {
    console.error(err);
}

My main uncertainty in both cases is whether childIdRef appears as a param in the success handler, which would seem sensible but I can't find confirmation.

score 1 · Accepted Answer · edited May 23 '17 at 11:44

The Firebase JavaScript SDK does not expose any promises, so there is no then(). It instead works based on callbacks.

Aside from that, I am not completely sure what you are trying to accomplish. So I'll just give some common snippets in hopes that one of them helps.

Firebase's push() operation is a pure client-side operation. It does not perform a round-trip to the server, but generates a statistically unique ID on the client.

Now let's assume that you want to create a new post (under /posts/$postid) and add a link to that new post to another location of the database (say /users/$uid/posts/$postid):

// Generate a reference to a new location and add some data using push()
var newPostRef = postsRef.push();

// Get the unique ID generated by push()
var postID = newPostRef.key();

// ref is a reference to the root, uid is the id of the current user
var userRef = ref.child('users').child(uid);

// Write the post to Firebase
newPostRef.set({ title: 'Firebase: Using the newly created key...', uid: uid }, function(newRef) {
    userRef.child('posts').child(postID).set(true);
});

You'll note that I don't use the newRef inside the callback. Since I already know what postID is.

The above approach will perform two write operations to Firebase:

the actual post
the link to the post in the user's profile

Since Firebase 2.4 (for JavaScript, 2.3 for Android and iOS) it is possible to perform both writes as a single operation. This again makes use of the fact that we can "pre-calculate" the post-ID as a client-side push() operation:

var ref = new Firebase('https://your-app.firebaseio.com');
var postsRef = ref.child('posts');

// Get a unique ID generated by push()
var postID = postsRef.push().key();

// Create a single object, where we'll put all updates
var updates = {};

// We'll put the post into /posts/$postId
updates['/posts/'+postID] = { title: 'Firebase: Using the newly created key...', uid: uid };

// Put the postId under /users/$uid/posts/$postId
updates['/users/'+uid+'/posts/'+postID] = true;

// Now write to both locations in one "big" swoop:    
ref.update(updates);

Firebase: Using the newly created key in the success callback

3 Answers3