React-native-gifted-chat: How to notify the user when a new message is sent to your account

Created on 5 May 2018 · 3Comments · Source: FaridSafi/react-native-gifted-chat

Issue Description

I want to figure out how a REST server can notify the clients when a new message arrive. I have saw in ChatApp https://github.com/FaridSafi/ChatApp/blob/master/src/Backend.js the method that retrieves the messages from the Backend. However in my case the server will be with a REST SpringMVC.

I have tested this flow:

One user sent a message to another through of REST server;
The server store the message in database and send an event to the client using websocket and stompjs;
The client receive the message from socket (json), parse the text and delivery the message with giftedchat: onReceive(text) method.
The client see the message in his device (ios or android).

However that approach seems to be much more complex than the ChatApp sample, besides of that, I am not sure if it's a good idea. All the clients will be connected through sockets and I am afraid it can be tough to control the flow of connections.

I'll be very grateful and will appreciate any ideia!

Additional Information

Nodejs version: v8.6.0
React Native version: 0.50.3,
react-native-gifted-chat version: ^0.4.3
Platform(s) (iOS, Android, or both?): Both

wontfix

Source

cassioseffrin

❤1

Most helpful comment

I am answering my own question. Maybe it can help someone else. I read a lot of material comparing Server-Sent Events VS websocket. I choosed to go forth with websocket.
Basically I have installed the 2 packages: sockjs-client, react-stomp and I made a correction in
node_modules/sockjs-client/lib/transport/browser/abstract-xhr.js line 76
from: this.xhr.withCredentials = 'true'
to : this.xhr.withCredentials = true; // just removed the quotation marks

Here is the part of my RN page that register in server socket an receive the responses:

import SockJS from 'sockjs-client';
require('stompjs');

componentDidMount(){
        var socket = SockJS(`${apiConfig.urlAuthProduction}/payroll`);
        var stompClient = Stomp.over(socket);
        var that  = this;
        stompClient.connect({}, function() {
          stompClient.subscribe(`/topic/newChat?userToId=${userFrom.accountId}`, function(message) {
                    that.onReceive(JSON.parse(message.body).message);
                });
            });
    }

However, I still interested in listen another experiences around that question.

cassioseffrin on 6 May 2018

❤3

All 3 comments

Here is the part of my RN page that register in server socket an receive the responses:

import SockJS from 'sockjs-client';
require('stompjs');

componentDidMount(){
        var socket = SockJS(`${apiConfig.urlAuthProduction}/payroll`);
        var stompClient = Stomp.over(socket);
        var that  = this;
        stompClient.connect({}, function() {
          stompClient.subscribe(`/topic/newChat?userToId=${userFrom.accountId}`, function(message) {
                    that.onReceive(JSON.parse(message.body).message);
                });
            });
    }

However, I still interested in listen another experiences around that question.

cassioseffrin on 6 May 2018

❤3

Maybe you'll interested in XMPP?

aoarashi1988 on 10 Aug 2018

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.