JavaScript Web Bridge
Last updated
Last updated
JavaScript Web Bridge is currently in a public beta testing phase.
JavaScript Web Bridge is a code editor tool that allows Creators to write their own Javascript and turn it into block-based format for use within their projects.
To add a JavaScript Web Bridge component to your app:
Go to your Blocks tab.
Scroll to the bottom of your blocks panel on the left side and find the Advanced
section.
Click the expand chevron to show the Advanced invisible components.
Click the ⊕ icon next to JavaScript Web Bridges
.
A JavaScript Web Bridge component properties dialog launches. See the chart below for descriptions of the various properties. Click Submit to create the JavaScript Web Bridge component, or Delete to dismiss the dialog without creating the component.
Property | Description | Data Type |
---|---|---|
URL | Set the URL for the location of the code (e.g. Github Repository). HTML files can also be uploaded into a project as an asset and the asset name can be used in the URL string (e.g. index.html). | String |
When JavaScript Web Bridge Receives Message
The "when JavaScript Web Bridge receives message" block fires when the JavaScript Web Bridge receives a message from the the source URL or the HTML asset listed in its settings. It returns the "message" output, text that contains the message that was received.
Call Web Viewer's Post Message
If you own the web page listed in the settings of the JavaScript Web Bridge, you can send and receive messages between your web page and the JavaScript Web Bridge using Javascript code. The "call JavaScript Web Bridge's post message" sends a string that can then be used by the web page.
You can see examples of sending and receiving messages and get further setup instructions here: Thunkable Web Viewer Extensions.
Call Web Viewer's Value From Post Message
The "call JavaScript Web Bridge's value from post message" block returns any message received from the webpage using the "JavaScript Web Bridge's post message" block.