JavaScript Quick Start Guide

Getting started with Pusher is very easy. If you have any questions though, get in touch.

This quick start covers using the JavaScript client API and also shows how to trigger an event from one of our Server API libraries.

1. Sign up

   Signup to Pusher, and make a note of your API key

2. Include the JS files

   Include the Pusher JavaScript script tag on your page.

   <script src="http://js.pusher.com/1.12/pusher.min.js"></script>

3. Open a connection to Pusher

   You first need to establish a connection to Pusher, and subscribe to your first channel. This is done by using your API key.

   var pusher = new Pusher('abc243231a132b21c321'); // Replace with your app key var channel = pusher.subscribe('my-channel');

   Note: more info on choosing channel names is available here.

4. Listen for events on your channel

   Now you can 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); });

5. Trigger events from your server

   In the examples below we post an event named my-event to Pusher on a channel called my-channel. For each example below a server library deals with the server communication. If there isn't an example in a language that you are familiar with then have a look on our server libraries page to see if anyone has created one in your language.

   # http://rubygems.org/gems/pusher require 'pusher' Pusher.app_id = 'APP_ID' Pusher.key = 'API_KEY' Pusher.secret = 'SECRET_KEY' class HelloWorldController < ApplicationController def hello_world Pusher['my-channel'].trigger('my-event', {:message => 'hello world'}) end end # http://rubygems.org/gems/pusher require 'pusher' Pusher.app_id = 'APP_ID' Pusher.key = 'API_KEY' Pusher.secret = 'SECRET_KEY' Pusher['my-channel'].trigger('my-event', {:message => 'hello world'}) // https://github.com/squeeks/Pusher-PHP require('Pusher.php'); $pusher = new Pusher($key, $secret, $app_id); $pusher->trigger('my-channel', 'my-event', array('message' => 'hello world') ); // https://github.com/crossbreeze/node-pusher var Pusher = require('node-pusher'); var pusher = new Pusher({ appId: 'YOUR_PUSHER_APP_ID', key: 'YOUR_PUSHER_APP_KEY', secret: 'YOUR_PUSHER_SECRET_KEY' }); pusher.trigger('my-channel', 'my-event', {"message": "hello world"}); using System.Web.Mvc; using System.Configuration; using System.Net; using PusherRESTDotNet; public class HelloWorldController : Controller { [HttpPost] public ActionResult HelloWorld() { string applicationKey = ConfigurationManager.AppSettings["application_key"]; string applicaitonSecret = ConfigurationManager.AppSettings["application_secret"]; string applicationId = ConfigurationManager.AppSettings["application_id"]; IPusherProvider provider = new PusherProvider(applicationId, applicationKey, applicationSecret); ObjectPusherRequest request = new ObjectPusherRequest('my-channel', 'my-event', new { message = "hello world" }); provider.Trigger(request); return new HttpStatusCodeResult((int)HttpStatusCode.OK); } }

Where next?

Find out about all the cool stuff you can do with channels, Investigate the JavaScript client library or learn how to excluding event recipients when publishing events.