Need help triggering pusher events

I have been successful in setting up a Pusher account and implementing it into my app. I can use the Pusher server to send out events and my app responds immediately. I am having trouble getting my head around enabling the retool app to be the thing that triggers an event. Looks like the app needs to subscribe to a private channel and get authenticated and such. I am not sure how to implement the example scripts listed on the Pusher docs. Does anyone know how to do this part of implementing Pusher? Maybe @dcartlidge ?

You'll need to use the trigger function of the Pusher channel object you subscribed to.

Authentication of users and private channels/ presence channels will require an channelAuthorization endpoint service to be defined. I'm using a Lambda function for this but you can use anything you wish.
This route is only really necessary if you need the other active app users to know "who" is making changes or is logged in - ie things like chat windows or knowing who else is making changes.
In many cases you'll probably be fine to trigger a peer-to-peer event from the pusher client itself.

From your Retool App you would use the Pusher js library to trigger the notification event directly. I use a global function in the scripts tab of my retool app for this, it can then be called from any retool js function as needed. It handles connection to Pusher, holds a list of the channel subscriptions, and acts as a wrapper for triggering events to that channel. So in my Retool js query I call myPusher.trigger(channel, event, data) and it handles the rest. All this does is call the Pusher function channel.trigger('channel-event', data) but it makes it easier to handle multiple channel connections and not have to store a reference to the Pusher channel object somewhere in your code when you subscribe.
You could call the Pusher trigger function directly from your retool js query without needing this, but long term I found it easier to do with a singleton that can be accessed anywhere in my app.

workflow is:
Load the Pusher library in the scripts tab of your app
In some js after the app has loaded and the Pusher client has loaded call the Pusher.subscribe function to subscribe to a channel - this returns a channel Object
Bind to the channel to listen to events you'rs interested in
Transmit to the channel events you want to tell other users about

Thanks so much for all that detail!. So, I have this url loaded into my libraries section.

I'm thinking that is what is needed? It seems to be working for writing scripts that receive test events from the Pusher server just fine. The library you mention is this same one right? I'm glad to here I don't actually need to be running with private channels because I have no need for it(and it seems kind of complicated at the moment). All I want to be setting up is if two people are working at adding new information to a production floor data package, there is less chance that people try to submit identical database items. All I need is to send all apps the new information a user just added which will setIn() that data to a temporary state in there app. And reduce having to query the database constantly when people add new stuff to be sure it isn't already there. I am going to be testing out the info you have supplied. It looks similar to what I was trying(as explained by chat GPT). What was happening to me though, was when I called a trigger function for the channel, retool kept telling be the variable I was using to run the .trigger() was not defined when I ran the JS query.

So that sounds like you're on the right path, there might just be some scoping issues with that variable you're using. And, yes, that's the Pusher library I was referring to that has the functions in it to transmit and receive messages.

For the use case of "records have changed since you found it" style messaging then this should be fine, when that's received by the Pusher client then you can trigger a reload of the query in your Retool App or whatever action is needed. I went the whole hog and had it "lock" records when another user was making and edit and trigger a reload when it had successfully saved.

Wish I could share the code or screenshots but the app isn't allowed to be publicly shared like that

Thank you. I was mainly thrown off by the error and the suspicion that I was maybe going to have to implement the private channel thing. I will probably do something similar with locking an item and displaying the indication of a process underway.

It can get complicated when you start doing multi-user, consider a user who starts making a change, doesn't save it, closes the browser etc

Your right. Will need some sort of timeout that unlocks the item incase someone walks away on holidays with something left locked. I sense workflows coming into the picture.

@dcartlidge So I have got it working. Looks like authentication is actually required now though, to send client events. I see the events from the app come into the pusher console with the message stating something about only authenticated client events are allowed. I'm about to try setting up an AWS Lambda free account. Just though I would put this out there incase I missed something and am about to run off in a wild unnecessary direction.

Well, I took a different route. I implemented ably, another pusher type service that offers a similar free tier. Seems it has a bit more streamlined authentication built in and I didn't end up needing to go the serverless route just to get authentication. So far, seems to be working perfectly!

1 Like