Laravel: Making a Real Time Application using Angular

LoveAndHappiness picture LoveAndHappiness · Jul 19, 2014 · Viewed 8.3k times · Source

I am starting to work with angular and am fascinated by the bi-directional data-binding capabilities and by its $http method, which lets me save changes in to my mysql database, without refreshing the page.

Another thing I am currently fascinated by is the real time capability across multiple clients using firebase. Here all clients are updated in REAL TIME, when the database receives any changes. I'd probably like to use firebase, but I would have to drop Laravel and MySql as a persistence layer entirely, which I would like to keep for the moment, since my application is already working in Laravel, just not in real time.

How would I go about having a Real Time application, which updates every client, without refreshing the view, in Laravel using MySQL and Angular?

If I am not mistaken, Pusher and PubNub, are providing this necessary open connection with the server using websockets, so when the server has something to share, angular will now and render it.

Since I would like to use Laravel and MySQL as a persistence layer, I am not sure, what the best way would be. I am not even sure, if I understood everything correctly, which I wrote above, since I am new to angular and real-time applications.

What would be the next necessary steps, to get some Real-Time capability into a PHP/MySQL application?

Answer

Claudivan picture Claudivan · Jul 19, 2014

The solution for your problem is:

1º - open websocket connection with the websocket-server and subscribe a channel, after this send the data to your serve using ajax tutorial angular pusher

2º - In server side, you get the data, saves to your database and send a 'PUBLISH' to the respective channel into websocket server lib useful for this

3º - Through the subscribe gets the data in real time

Pusher.subscribe('channel', 'event', function (item) {
    // code
});