Add presence channels example (#152)

Anya Zenkina · web-flow · commit a1b287551a3d · 2020-01-10T16:06:19.000Z
* add private channels example

* add frontend to private channels example

* change to presence channel
diff --git a/examples/presence_channels/presence_channels.rb b/examples/presence_channels/presence_channels.rb
@@ -0,0 +1,56 @@
+require 'sinatra'
+require 'sinatra/cookies'
+require 'sinatra/json'
+require 'pusher'
+
+# You can get these variables from http://dashboard.pusher.com
+pusher = Pusher::Client.new(
+  app_id: 'your-app-id',
+  key: 'your-app-key',
+  secret: 'your-app-secret',
+  cluster: 'your-app-cluster'
+)
+
+set :public_folder, 'public'
+
+get "/" do
+  redirect '/presence_channels.html'
+end
+
+# Emulate rails behaviour where this information would be stored in session
+get '/signin' do
+  cookies[:user_id] = 'example_cookie'
+  'Ok'
+end
+
+# Auth endpoint: https://pusher.com/docs/channels/server_api/authenticating-users
+post '/pusher/auth' do
+  channel_data = {
+      user_id: 'example_user',
+      user_info: {
+        name: 'example_name',
+        email: 'example_email'
+      }
+    }
+
+  if cookies[:user_id] == 'example_cookie'
+    response = pusher.authenticate(params[:channel_name], params[:socket_id], channel_data)
+    json response
+  else
+    status 403
+  end
+end
+
+get '/pusher_trigger' do
+  channels = ['presence-channel-test'];
+
+  begin
+    pusher.trigger(channels, 'test-event', {
+      message: 'hello world'
+    })
+  rescue Pusher::Error => e
+  # (Pusher::AuthenticationError, Pusher::HTTPError, or Pusher::Error)
+  end
+
+  'Triggered!'
+end
diff --git a/examples/presence_channels/public/presence_channels.html b/examples/presence_channels/public/presence_channels.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<head>
+  <title>Pusher Test</title>
+  <script src="https://js.pusher.com/5.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: 'your-app-cluster',
+      forceTLS: true,
+      authEndpoint: '/pusher/auth'
+    });
+
+    var channel = pusher.subscribe('presence-channel-test');
+    channel.bind('test-event', function(data) {
+      alert(JSON.stringify(data));
+    });
+  </script>
+</head>
+<body>
+  <h1>Pusher Test</h1>
+  <p>
+    Try publishing an event to channel <code>presence-channel-test</code>
+    with event name <code>test-event</code>.
+  </p>
+</body>
