Search code examples
javascriptphpeventspublish-subscribepusher

Pusher event is triggered twice

I'm using Pusher (pusher.com) to trigger notification to all logged in clients whenever the admin sends one.

For some reason the event is shooting twice, although I only trigger it once.

Client side subscription code:

var handleToastrListener = function() {

     var pusher = new Pusher("913284db62a0cc237db4");
     var channel = pusher.subscribe('toastr-channel');

           channel.bind('new-toast', function(data) {

            toastr.options = data.options;
            var $toast = toastr[data.scf](data.msg, data.title);

           return true;

           });  
   }

       handleToastrListener();

Server side publish code (PHP using pusher package):

 $pusher = new Pusher(PUSHER_KEY, PUSHER_SECRET, PUSHER_APP_ID);
 $pusher->trigger('toastr-channel', 'new-toast', $input );

The Pusher debug console shows that only one message was received.

The pusher-js Javascript logging, however, shows two messages:

Pusher : Event recd : {"event":"new-toast","data":{"options":{"positionClass":"toast-top-right","onclick":"","showDuration":"1000","hideDuration":"1000","timeOut":"5000","extendedTimeOut":"1000","showEasing":"swing","hideEasing":"linear","showMethod":"fadeIn","hideMethod":"fadeOut"},"title":"Toastr Notifications","msg":"Gnome & Growl type non-blocking notifications","scf":"success"},"channel":"toastr-channel"} app.js:143
Pusher : Event recd : {"event":"new-toast","data":{"options":{"positionClass":"toast-top-right","onclick":"","showDuration":"1000","hideDuration":"1000","timeOut":"5000","extendedTimeOut":"1000","showEasing":"swing","hideEasing":"linear","showMethod":"fadeIn","hideMethod":"fadeOut"},"title":"Toastr Notifications","msg":"Gnome & Growl type non-blocking notifications","scf":"success"},"channel":"toastr-channel"}

looking further I found the subscription occurs twice, although I call it only once:

Pusher : Event sent : {"event":"pusher:subscribe","data":{"channel":"toastr-channel"}} app.js:143
Pusher : Event recd : {"event":"pusher_internal:subscription_succeeded","data":{},"channel":"toastr-channel"} app.js:143
Pusher : No callbacks on toastr-channel for pusher:subscription_succeeded app.js:143
Pusher : State changed : connecting -> connected app.js:143
Pusher : Event sent : {"event":"pusher:subscribe","data":{"channel":"toastr-channel"}} app.js:143
Pusher : Event recd : {"event":"pusher_internal:subscription_succeeded","data":{},"channel":"toastr-channel"} app.js:143
Pusher : No callbacks on toastr-channel for pusher:subscription_succeeded
Solution

  • Two things you should definitely take a look at and update your question appropriately:

    1. The Pusher Debug Console - is the event shown twice in there?
    2. pusher-js JavaScript logging - is the event being logged as incoming twice?

    The other common problem here is that sometimes events may have been bound to twice - hence, two callbacks. However, your code doesn't suggest that this is happening.