Update appVar from Javascript OR Multiple Returns from Javascript

Hello, I’m working on the websocket javascript function and looking to process the receipt of updated messages.

What I have been able to do:

  • Connect to webhook using:
    var Socket = new self.WebSocket('wss://url');
  • Log to console the initial and subsequent update messages.

What I have not been able to do:

  • Receive the initial or subsequent messages propagated out of the javascript to the app where the data can be used

What I’ve tried:

  • Using ports (port2 = ‘feed’) to return messages:

Socket.onmessage = async function(socket_msg) {

onDataType=‘data’
console.log(‘received’,data.payload.data[queryLabel]);
return [1,{feed: data.payload.data[queryLabel]}];
}

  • same as above for Socket.oncomplete
  • just awaiting and only returning on data received to port 1 or 2
  • figuring out if the function can access appVars or pageVars scope to write async’ly

In all cases, the function continues with an empty output but 200ms later the console logs out the initial received data and also logs out to console any subsequent messages received.

Open questions:

  • Is there any way to have a function able to access the appVars or pageVars scope directly e.g. self.appVars.variable1 kind of thing?
  • Is it possible to have custom javascript functions push data forward in the flow more than the initial output?
  • Is there a different way to accomplish what I’m attempting that I’m not understanding, yet?

Thanks everyone!

2 Likes

@Harri_Sarsa happy new year!

Do you happen to have a thought on this? I’m trying to propagate the data from a custom_function back to an app variable.

Cheers,
Lance

The pattern here would be to use the internal API for sending events in the JS callback, which can then be received with the Receive event node.

If you link to the page where this JavaScript box is, I can enable this for you but it’ll be at your own responsibility, as it’s a secret undocumented feature still. :slight_smile:

Hello Harri,

Thank you so much!

This is the test page: https://platform.appgyver.com/builder/applications/184207/pages/7

By navigating to that page, it currently prints out the messages received to the console but is missing the magic you speak of.

I’m assuming that you showing my how to do this, I’ll be able to reuse the ability in my main app?

Cheers,
Lance

I added the logic – the secret sauce is exposing the internal supersonic and contextId properties (which is something regular users can’t do), then using supersonic.api.events.send function in the callback. The Receive event node is below the JS box. Let me know if it works!

You can “smuggle” the logic into another app by copypasting the JS node onto e.g. a button component’s logic canvas, then copying the button component over via CMD+C / CMD+V – the logic gets copied along the component, and now you have a JS box with the internal props exposed in your other app too.

Hey Harri, and the appgyver team!

Thanks so much for showing me that hack! I love you!

Cheers

I want to do something similar in my application, so looking for the magic-sprinkle to access app variables from within custom JS.

https://platform.appgyver.com/builder/applications/182658/pages/1

Also, any tips or best practices for being a good citizen with websockets…? When the app exits, what’s the best way to ensure the socket is closed on the way out? (I don’t see an app event for like “on exit” or “page unmounted”, for example)

How best to test the socket periodically and reset it if the connection is down? Can the socket handle be stored in an app var, and a separate function test and reset it periodically?

Thx!
Chris

Sprinkled some magic into your JS box on the Page logic canvas!

Not sure about the best way to test the connection tho… Page logic execution should stop when the page is dropped from the nav stack though.

Hey @Harri_Sarsa, could I also please access the internal API code you shared with the others? I also need to use websockets in order to allow real-time connection between app and server. Thanks!

Hi @Harri_Sarsa,

Is there a chance you could also implement the same functionality on this app?,
I have the same problem, I can log and alert the received message but I can’t store it in a variable.
Here is the link to the app:
https://platform.appgyver.com/builder/applications/264214/pages/4

Thank you.

Yes, I am looking for this as well. Just setup a test app ( 271421 ) that I’d like to test this on.

Thanks

Hi @1080_Agile,

could you please share the AG setup and code that you’re using? I’m pretty new to socket.io, and need some guidance how to establish the connection within Appgyver page. Thank you!

Hi @Harri_Sarsa,

I’m trying to do something similar, could you please expose the same logic to AppGyver - Composer Pro so we can test.

Many thanks

Dom

@Dom_Chm done! Could not find a JS flow on the page so added one under page logic. You can copy-paste it elsewhere as well.

@Mevi @Harri_Sarsa

Could you please add this internal feature to my test websocket reading JS box in AppGyver - Composer Pro too?

Hi, i would like to get some help with WebSockets.
I have a Home page where I would like to open a socket and keep it until the app is closed
https://platform.appgyver.com/builder/applications/416257/pages/14
And shop page where I get only answers from the server over WebSocket
https://platform.appgyver.com/builder/applications/416257/pages/5

I really appreciate any help you can provide.

Hi Harri,
Would you mind to show me how to use the “supersonic”, “contextId” and “supersonic.api.events.send”?
Any example on it?

Thanks,
Lung

1 Like

Hi! By default you should not be using any of those commands. There are no examples for it because it’s a workaround and we by default do not want anyone to be using it if at all possible to do in another way.

Yes please some more info, it’s a show stopper for me and the feature list is long…

I’ve added the logic - the secret sauce is exposing the built-in supersonic and contextId properties (something regular users cannot do) and then using the supersonic.api.events.send function on the return of call. The Receive event node is below the JS box. Let me know if it works!

add to mine too
https://platform.appgyver.com/builder/applications/551974/pages/1

pleeaaaase