How to Send Real-Time Notifications to Client via Pusher in PHP?
Published on 14 August 17
Helios0
The world is witnessing fast-paced advancements in each and every field and the change in the technological realm is evidently exponential. The changes in technological realms have a direct impact on the business world – the way you conduct business today is way too different from the traditional way of doing business.
Often you need to send real-time notifications to your clients so that they can act on it. Although there are different ways of implementing it; for instance through Ajax, HTML5 or even through Pusher in PHP.
In this post, firstly we would take a look at why it is not recommended to implement it via Ajax and then we would consider how to do it via Pusher in PHP.
Why Ajax is not the right fit?
Our web app development experts recommend not using Ajax because frequent Ajax request tend to slow down the server. Moreover, in rare case it can also cause Slowloris attack in the apache server. This is because threads for each request are generated by the apache server.
Slowloris is a kind of denial of service attack. It was invented by Robert RSnake Hansen that allows a single machine to take down a web server.
Therefore, the correct way of implementing the real-time system is via web socket connections and this is perhaps the best way too. It enables you to establish a continuous connection between clients and server. So you are not required to overload the server via continuous requests.
Pusher in PHP
In this post our team of PHP specialists will show you how to send real-time notifications through Pusher in PHP.
All you need to do is visit pusher.com and sign up with your Google or GitHub account to Pusher. The welcome news is that their basic plans are absolutely free. We will use a free plugin called Bootstrap Notify in order to convert standard alerts into notifications. This free plugin can be downloaded from http://bootstrap-notify.remabledesigns.com/.Now let’s get started!
Firstly, you would need to create two pages – one for the client to display the notifications and another for the server to send notifications to clients.
In the page for the client, you would need to use JavaScript codes in order to establish a socket based connection to Pusher. Here is the code:
<script src="https://js.pusher.com/4.0/pusher.min.js"></script>
<script>
// Enable pusher logging - don't include this in production
Pusher.logToConsole = true;
var pusher = new Pusher('your app key', {
cluster: 'ap2',
encrypted: true
});
var channel = pusher.subscribe('my-channel');
channel.bind('my-event', function(data) {
console.log(data.message);
});
</script>
Next, in the page for server side you would have to send notifications via pusher to all the connected clients. You can find the code below:
require('vendor/autoload.php');
$options = array(
'cluster' => 'ap2',
'encrypted' => true
);
$pusher = new Pusher(
'your app key', // app key
'your app secret', // app secret
'your app id', // app id
$options
);
$data['message'] = 'Hello Friends';
$pusher->trigger('my-channel', 'my-event', $data);
However, prior to starting server side coding you would need to download Pusher library for PHP and you can use composer for that.
In case, you are unfamiliar with the term then it is a Dependency Manager for PHP and can be downloaded from https://getcomposer.org/.
Once you finish installing it, paste the below given command in your project folder either through terminal or cmd.
composer require pusher/pusher-php-server
Consequently, a vendor folder would be created within your project folder containing all your libraries. Now you would need to autoload.php file inside vendor folder in all the server side pages.
Once you are done with this, you are all set to start creating your own demo-app.
Now it’s your turn
If you think you need still more clarification on this please talk to our PHP experts and engage your clients with real time push-notifications.
Which technology would you prefer to send real-time notifications to your clients? Please let us know by leaving your comments below.
Related Posts:
Post a Comment
