JavaScript Web Bridge

JavaScript Web Bridge is currently in a public beta testing phase.

Overview

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.

Add a JavaScript Web Bridge to Your App

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.

PropertyDescriptionData 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

Event Blocks

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.

Function Blocks

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.

Last updated