Getting Firebase Realtime Database Value By Child - javascript

I'm developing an application that has a chat page.
I'm using Firebase realtime database and my chat structure like this:
I'm getting new messages as below:
fireBuddyChats = firebase.database().ref('/buddychats');
this.fireBuddyChats.child(this.currentUserId)
.child(this.buddy.uid)
.orderByKey()
.limitToLast(topMsgCount)
.on('value', (snapshot) => {
this.buddyMessages = [];
let temp = snapshot.val();
for(var tempKey in temp) {
this.buddyMessages.push(temp[tempKey]);
}
this.events.publish('newmessage');
}
I'm listening 'newmessage' event to show new message in chat page.
The problem is: While i chatting somebody, if another friend sends any message, database trigger (I mentioned above) runs and chat page shows another friend's messages. I think it shouldn't be triggered because the "this.buddy.uid" is different. What i'm missing? Is there any suggestion?

Maybe to prevent this you can add a conditional statement above to check if the user (the current user is talking to) actually has the uid of "this.buddy.uid". So maybe for the code you could possibly include somewhere:
if (socket.uid == this.buddy.uid).then
This should prevent other users from joining/adding themselves onto the real-time database conversation as it is checking if the user constantly.
Hopefully this helps.

Related

I want to show live data in my node.js app WITHOUT a loop. How do I use mongoDB like Firebase? Is sockets suitable?

A new message gets inserted into the mongoDB from another application that I don't have access to the code. I do have the database credentials though. I want to make that message show on my application at the moment it gets inserted into mongoDB. I don't want to loop. I want to show the new data the moment it gets Inserted or Updated.
A living example: Auction websites generally update the newest bids really quickly, a few seconds before the auction deadline ends. I am wondering how that works without loops. Like a chat app, but waiting for new data in the database instead of another user typing a message. But in my situation, the data gets Inserted or Updated by another application.
Some additional information: I am also using routers / express and hbs html template. I am happy enough if I get atleast a general idea of how to do this, without working with routers / express yet. But if you guys can come up with a combined solution that would be perfect!
I have something like this so far but it's still a bit confusing. You can pretty much ignore my code since it's not working completely. But maybe it helps a bit.
(some more code above ...)
const WebSocketServer = new WebSocket.Server({port: 8082})
WebSocketServer.on('connection', ws => {
console.log('New client connected!')
ws.on('message', async (data) => {
console.log(`Client has sent us: ${data}`)
const connMtlinki = require('../src/db/mtlinki')
const connection = connMtlinki.connect()
const database = connMtlinki.db('MTLINKi')
const MacroVariableHistory = database.collection('MacroVariableHistory')
const machines = await MacroVariableHistory.findOne({ L0Name: data })
console.log(machines)
ws.send(machines)
})
ws.on('close', () => {
console.log('Client has disconnected!')
})

How to retrieve a specific data from Firebase

I am designing a website where when the user comes and enters his email id, a corresponding value gets printed on the website.
I have the below data on my real-time firebase database.
How do I write a javascript function in my JS file so that when a user enters his/her email-id, the value of the total gets printed on the website?
I have tried something like this:
function getdata(){
var email=document.getElementById("email").value;
firebase.database().ref('0/'+email).once('value').then(function(snapshort){
var total=snapshort.val().total;
document.getElementById("total").innerHTML=total;
})}
I think you're trying to perform a query based on the email property of the node.
In that case, it'd be:
firebase.database().ref()
.orderByChild("email")
.equalTo(email)
.once('value').then((results) => {
results.forEach((snapshot) => {
let total = snapshot.val().total;
document.getElementById("total").innerHTML=total;
});
});
I recommend reading the Firebase Realtime Database documentation end-to-end, as it should answer many of the questions you may have about the API. A few hours spent there now, will save you many hours down the line.

Firebase One on One Chat

I am trying to create a one to one chat on a global firebase chat. I was wondering how would I proceed to do it? What I am doing now is that I created another HTML file which is where the private chats would happen and I am searching by users id
with this piece of code.
oneOnone.addEventListener('click', function(e){
// Attach an asynchronous callback to read the data at our posts reference
ref.on("value", function (snapshot) {}, function (errorObject) {
console.log("The read failed: " + errorObject.code);
});
ref.orderByChild("userId").on("child_added", function (snapshot) {
console.log(snapshot.val().userId);
console.log(searchId);
if(searchId.value === snapshot.val().userId){
window.location.href = 'privatemessage.html';
}
});
});
This then leads into the privatemessage.html file where all the chats should happen. The feeling I have been having is that my database might not right.
The database on firebase still registers people as it would in a Global chat, not a 1 on 1 chat. I am just completely confused on how to make sure the chat would be between only two people. If someone could recommend a guide, give a full fledged explanation on how 1v1 chat would work that would be appreciated. Yes I have look at the docs, it really does not explain how to do a 1v1 chat.
Edit
So I have changed up my database to this
So what I am leaning on is something like this for the one on one talk
var pmChat = database.ref('chat/' + userId);
Basically creating a new reference and then linking the userid but now, how I link the userid of the other user?
you can link current user id with the other userid like this:
database.ref('chat').child(currentUserId).child(otherUserId).child(message);
database.ref('chat').child(otherUserId).child(currentUserId).child(message);

Retrieve data in Firebase exactly once

I have a real time database with firebase and i'm using the following code to connect to the database and get some data from it.
window.onload = function(){
var databaseWebsites = firebase.database().ref('/websites').orderByChild('votes');
console.log(databaseWebsites);
databaseWebsites.on('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var webTemp = document.getElementById(childSnapshot.val().id);
webTemp.style.order = order;
var webText = webTemp.getElementsByClassName('likeText');
webText[0].innerHTML = childSnapshot.val().votes;
order--;
});
order = 0;
});
It gets all the data, in order and uses it correctly.
The problem is, I don't want the data on the front end to update until the user refreshes the page. The system is a voting system that is ordered by votes value, if it was constantly updating it would be a bad user experience.
Any help will be appreciated.
Thanks
Change the on to once, Firebase on listens for changes in your database node and sends a response.
databaseWebsites.on('value', function(snapshot) {
to
databaseWebsites.once('value', function(snapshot) {
An excerpt from Firebase doc
The value event is called every time data is changed at the specified
database reference, including changes to children. To limit the size
of your snapshots, attach only at the lowest level needed for watching
changes.
Visit this url to read more
The accepted response is not correct (maybe outdated?) because once() requires to add a then()
It's actually
databaseWebsites.once('value').then(function(snapshot) {}
that replaces
databaseWebsites.on('value', function(snapshot) {}

Removing someone from a user hash on navigating away from a page / page close

I'm building a Node.js / Socket.io project.
I have a hash of Users based on their websocket id. When a user makes the following request i'd like to add them to a group of users viewing that page.
app.get('/board/:id', function(req, res){}
I'd like to keep something like
Browsing = {
username : id,
username : id,
...
}
However i'm unsure how to remove a user lets say if they navigate off the page. Is there some kind of function that gets called upon page leave?
Partial Solution:The following seems to do the trick on Chrome:
$(window).unload(function(){
var username = $('#username').text();
var pid = currentProject;
var data = {
username: username,
id : pid
}
socket.emit('leaving-page', data);
})
... Is there some kind of function that gets called upon page
leave? ...
Yes, but it is not reliable.
The way the people keep track of who is online and who isn't, is usually like this:
Add the time when the user last refreshed/visited a page
set a limit to you consider them offline
You could intercept the event which corresponds to leaving a page. There are several ways to do it, have a look at the following links and let me know if any suits your needs and if I can answer any more explicit questions about them:
Intercept page exit event
Best way to detect when a user leaves a web page?
jquery unload
with the last link you could do something like this:
$(window).unload(function() {
//remove the user from your json object with delete json_object[key];
});
Hope this helps.
Since you're using Socket.io, the server will know when the user has left the page because the socket will be disconnected. Simply listen for the disconnect event.
io.sockets.on('connection', function (socket) {
...
socket.on('disconnect', function () {
// The user on `socket` has closed the page
});
});
Better yet, take advantage of namespaces and let Socket.io handle all of the connection/disconnection (it's doing it anyway -- no need to duplicate effort).
On the client,
socket = io.connect('http://example.com/pagename');
pagename need not point to a valid URL on your domain – it's just the namespace you'll use in the server code:
io.sockets.clients('pagename')
Gets you all of the clients currently connected to the pagename namespace.

Categories