Client-Side

Client Side#

Since nestjs-pusher is a server-side library for Nestjs it does not bring anything to help you consuming events or interacting with it.

Here is a basic example on how you can consume Nestjs-pusher broadcasts.

Chunking enabled (Original link)#

<!DOCTYPE html>
<head>
  <title>Pusher Test</title>
  <script src="https://js.pusher.com/4.3/pusher.min.js"></script>
  <script>

    // Portable function you can copy-paste
    function bindWithChunking(channel, event, callback) {
      channel.bind(event, callback); // Allow normal unchunked events.

      // Now the chunked variation. Allows arbitrarily long messages.
      var events = {};
      channel.bind("chunked-" + event, data => {
        if (!events.hasOwnProperty(data.id)) {
          events[data.id] = { chunks: [], receivedFinal: false };
        }
        var ev = events[data.id];
        ev.chunks[data.index] = data.chunk;
        if (data.final) ev.receivedFinal = true;
        if (ev.receivedFinal && ev.chunks.length === Object.keys(ev.chunks).length) {
          callback(JSON.parse(ev.chunks.join("")));
          delete events[data.id];
        }
      });
    }

    // Example usage
    Pusher.logToConsole = true;
    var pusher = new Pusher(YOUR_APP_KEY, {
      cluster: YOUR_CLUSTER,
      forceTLS: true
    });
    var channel = pusher.subscribe('my-channel');
    bindWithChunking(channel, "my-event", data => {
      alert(JSON.stringify(data));
    });

  </script>
</head>
<body>
<h1>Pusher chunking example</h1>
<p>
  Try publishing an event to channel <code>my-channel</code>
  with event name <code>my-event</code>.
</p>
</body> 

Chunking disabled/Default Pusher behaviour#

You can follow the official link that will forward you to Pusher.js Javascript getting started page https://pusher.com/docs/channels/getting_started/javascript