Skip to content

Instantly share code, notes, and snippets.

@marchbold
Last active May 4, 2023 22:08
Show Gist options
  • Save marchbold/05b46ecbb7a3c8d0e882 to your computer and use it in GitHub Desktop.
Save marchbold/05b46ecbb7a3c8d0e882 to your computer and use it in GitHub Desktop.
A very simple example of sending a message to your WebView from Javascript
/**
* Air Bridge interface to communicate to actionscript through the NativeWebView ANE
*/
var AirBridge = (function () {
var instance;
function createInstance() {
var object = {};
object.useWindowLocation = true;
object.isWKWebView = false;
if (navigator.platform.substr(0, 2) === "iP") {
if (window.indexedDB) {
object.isWKWebView = window.webkit && window.webkit.messageHandlers;
}
}
object.messageStack = [];
object.messageStackInterval = 1; // milliseconds interval
object.messageInProgress = false;
object.message = function (message) {
object.messageStack.push(message);
if (!object.messageInProgress) {
object._checkNextMessageInStackTimeout();
}
};
object._sendMessage = function (message) {
object.messageInProgress = true;
try {
if (object.isWKWebView) {
window.webkit.messageHandlers.airbridge.postMessage(message);
} else if (!object.useWindowLocation) {
NativeWebView.airBridge(message);
} else {
window.location = "airBridge:" + message;
}
} catch (err) {
window.location = "airBridge:" + message;
}
setTimeout(
object._checkNextMessageInStackTimeout,
object.messageStackInterval
);
};
object._checkNextMessageInStackTimeout = function () {
object.messageInProgress = false;
if (object.messageStack.length) {
object._sendMessage(object.messageStack.shift());
}
};
return object;
}
return {
setUseWindowLocation: function (shouldUseWindowLocation) {
if (!instance) {
instance = createInstance();
}
instance.useWindowLocation = shouldUseWindowLocation;
},
message: function (message) {
if (!instance) {
instance = createInstance();
}
instance.message(message);
},
};
})();
// Here we assume you have previously initialised the extension
var webView:WebView = NativeWebView.service.createWebView( new Rectangle( 0, 0, 400, 600 ) ) ;
webView.addEventListener( NativeWebViewEvent.COMPLETE, webView_completeHandler );
webView.addEventListener( NativeWebViewEvent.JAVASCRIPT_RESPONSE, javascriptResponseHandler );
webView.addEventListener( NativeWebViewEvent.JAVASCRIPT_MESSAGE, javascriptMessageHandler );
var file:File = File.applicationStorageDirectory.resolvePath( "example.html" );
webView.loadURL( "file://"+file.nativePath );
...
function completeHandler( event:NativeWebViewEvent ):void
{
webView.evaluateJavascript( "alert('message from AS3');" );
}
function javascriptResponseHandler( event:NativeWebViewEvent ):void
{
trace( "evaluateJavascript response: " + event.data );
}
function javascriptMessageHandler( event:NativeWebViewEvent ):void
{
// This is the message sent from the javascript
// AirBridge.message i.e. 'content-for-air'
trace( "message from JS: " + event.data );
}
// com.distriqt.NativeWebView
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="airbridge.js" ></script>
<script>
"use strict";
function sendToAIR()
{
AirBridge.message( "content-for-air" );
}
</script>
</head>
<body>
<h1>NativeWebView Example</h1>
<p>
<button type="button" onClick="sendToAIR()" >Example Call</button>
</p>
</body>
</html>
@marchbold
Copy link
Author

@crooksy88
Copy link

Is this a typo? (should be addEventListener)

webView.removeEventListener( NativeWebViewEvent.JAVASCRIPT_RESPONSE, javascriptResponseHandler );
webView.removeEventListener( NativeWebViewEvent.JAVASCRIPT_MESSAGE, javascriptMessageHandler );

@marchbold
Copy link
Author

@crooksy88 Yep, I've corrected now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment