How to Use WebSockets Today With Pusher

Craig Buckler
Craig Buckler
Share

Brian Raymor’s recent SitePoint article, WebSockets: Stable and Ready for Developers provides a fabulous overview of the technology. In essence, WebSockets permit asynchronous bi-directional communication between the client and server. A connection is held open so lightweight messages can be sent from either device at any time. It’s an ideal solution for real-time chat and games and is likely to be more efficient than Ajax polling. That said, there are a couple of drawbacks:

  • WebSocket technology is relatively new and, at the time of writing, it’s only fully supported by Firefox and Chrome.
  • Even if your browser supports WebSockets, there’s no guarantee it’ll be natively supported by your server platform.
Stable and ready? Perhaps not yet. Fortunately, there’s another option if you’re desperate to exploit WebSocket technology today. Pusher is a new service which ployfills over the gaps in WebSocket implementation:
  • Pusher is a proxy service that sits between your clients and server.
  • On the client, Pusher provides a range of WebSocket libraries for JavaScript, iOS, Android, Flash, .NET, Silverlight, Ruby and Arduino.
  • If you’re using a browser which doesn’t offer native support, the JavaScript library automatically imports a Flash-based shim which implements WebSocket technology on IE6 to 9, Chrome 1 to 4, Firefox 1 to 3, Safari 1 to 4, Opera and Android.
  • On the server, Pusher provides a range of WebSocket libraries for PHP (generic and framework options), Ruby, ASP.NET (C# and VB.NET), Python, Node.js, Java, Groovy/Grails, Clojure, Coldfusion and Perl.
  • If you’d prefer not use the WebSocket API for triggering server events, you can adopt Pusher’s REST API.
The whole process is reassuringly simple. Once you’ve registered for a Pusher account, you’ll receive an API key. Your HTML5 page includes the JavaScript library, establishes a connection and subscribes to a named channel:

<script src="http://js.pusher.com/1.11/pusher.min.js"></script>
<script>
var pusher = new Pusher("YOUR-PUSHER-API-KEY");
var channel = pusher.subscribe("my-channel");
You can then define callbacks that bind to events coming in via the Pusher socket:

channel.bind("my-event", function(data) {
	alert("An event was triggered with message: " + data.message);
});
To send a message from PHP:

require('Pusher.php');
$pusher = new Pusher($key, $secret, $app_id);
$pusher->trigger( 'my-channel', 'my-event', array('message' => 'hello world') );
The Pusher website provides full documentation, a selection of tutorials for PHP and Ruby
and a showcase with case studies which might inspire your next world-beating real-time app. I like the concept behind Pusher. It’s a great solution if you want to try WebSockets today while supporting the majority of browsers and native OS platforms. There are free plans for experimental prototypes as well as paid accounts for heavier usage. For more information, refer to Pusher.com.

Frequently Asked Questions (FAQs) about Using Websockets Today with Pusher

What are the key differences between Pusher and Websockets?

Pusher and Websockets are both technologies used for real-time communication in web applications. However, they differ in several ways. Websockets is a protocol that provides full-duplex communication channels over a single TCP connection. It’s a low-level protocol that doesn’t provide any features like broadcasting, presence, or fallbacks. On the other hand, Pusher is a service that uses Websockets under the hood but provides a lot of additional features. It offers APIs to send and receive messages, handles reconnections and fallbacks, and provides features like channels and event triggering.

Why should I choose Pusher over other Websockets services?

Pusher stands out for its simplicity and robustness. It provides a simple API for sending and receiving messages, and it handles reconnections and fallbacks automatically. This means you can focus on building your application without worrying about the underlying complexities of real-time communication. Additionally, Pusher provides features like channels and event triggering, which can greatly simplify your code.

How can I integrate Pusher into my web application?

Integrating Pusher into your web application is straightforward. First, you need to sign up for a Pusher account and create a new app. You’ll then be given an app key, secret, and ID, which you’ll use to authenticate your app with Pusher. You can then use the Pusher JavaScript library to connect to Pusher from your web application, subscribe to channels, and bind to events.

Can I use Pusher with my backend language or framework?

Yes, Pusher provides libraries for a wide range of backend languages and frameworks, including Node.js, Ruby, Python, PHP, .NET, Java, and Go. This means you can use Pusher no matter what technology stack you’re using.

What are the fallbacks provided by Pusher?

Pusher provides several fallback mechanisms to ensure that your real-time communication works even in adverse network conditions. If a WebSocket connection can’t be established, Pusher will fall back to HTTP long polling. Additionally, if a connection is lost, Pusher will automatically attempt to reconnect.

How secure is Pusher?

Pusher takes security very seriously. All data sent to and from Pusher is encrypted using SSL, and you can also enable additional security features like private channels and signed events.

What is the performance of Pusher like?

Pusher is designed to be highly performant and scalable. It uses a distributed architecture to ensure that messages are delivered quickly, even under high load. Additionally, Pusher provides features like message batching and throttling to help you manage your application’s performance.

How much does Pusher cost?

Pusher offers a range of pricing plans to suit different needs. There’s a free plan that’s suitable for small projects, as well as several paid plans that offer higher limits and additional features. You can find more information on the Pusher website.

Can I use Pusher for mobile applications?

Yes, Pusher provides libraries for both iOS and Android, so you can use it for real-time communication in your mobile applications.

What kind of support does Pusher offer?

Pusher offers comprehensive documentation to help you get started and solve any issues you might encounter. Additionally, they provide email support for all customers, and phone support is available for customers on certain plans.