JavaScript Bridge Overview
The JavaScript Bridge is the communication channel between your website and the native app. When your website is loaded inside the Appilix app, it has access to a special object — appilix — that lets your website send instructions to the app and receive responses back.
This makes it possible to trigger native features — like the QR scanner, biometric authentication, or push notification identity — directly from your existing website JavaScript, without building a separate native app.
Sending a Message to the App
Use appilix.postMessage() to send instructions from your website to the app:
appilix.postMessage(JSON.stringify({
type: "action_type",
props: {
// optional parameters depending on the action
}
}));type— the name of the action you want to trigger (required)props— an object containing parameters for that action (optional, depending on type)
The message must be a JSON string, so always wrap the object in JSON.stringify().
Receiving a Response from the App
Some actions send a response back to your website. Listen for it using appilix.onmessage:
appilix.onmessage = function(event) {
const data = JSON.parse(event.data);
console.log(data);
// Clean up after handling the response
appilix.onmessage = null;
};Set the listener before or immediately after sending the message. Once you have handled the response, set appilix.onmessage = null to avoid accidentally handling future messages.
Detecting Whether the Site Is Running Inside the App
You can check whether your website is running inside the Appilix app by testing for the appilix object:
if (typeof appilix !== 'undefined') {
// Running inside the app
} else {
// Running in a regular browser
}Use this to conditionally trigger app-specific behavior — for example, showing a biometric prompt only when inside the app, and using a password form in the browser.
Available Actions
Each JavaScript Bridge action is documented in its own article:
- Identifying Users — Record user identity for targeted push notifications
- Triggering Biometric Auth — Prompt the user to authenticate before showing content
- Using the QR Scanner — Open the camera to scan a QR code
- Showing Interstitial Ads — Display a full-screen AdMob ad on demand
- Apple In-App Purchase — Initiate a purchase through Apple's payment system
- Logging AppsFlyer Events — Record marketing and analytics events
- Logging Meta Events — Record events for Meta (Facebook) analytics
- Updating Bottom Navigation — Replace navigation tabs at runtime based on user state
- Updating Navigation Drawer — Update drawer header and items at runtime
- Updating the App Bar — Change app bar colors and title at runtime