Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cannot postMessage from inappbrowser to Cordova application

I'm using this module (https://github.com/apache/cordova-plugin-inappbrowser) for the ability to open external links within my Cordova application. However, postMessage example from documentation doesn't work.

I need the ability to be able for an inappbrowser instance to communicate with the parent (the opener). Given that there is no opener object with the inappbrowser, I've looked through repo's documentation and tests, and I cannot reproduce the postMessage API to communicate between an inappbrowser instance and the main Cordova application (parent).

Here's a simple example taken from the documentation/test within this repo:

const ref = cordova.InAppBrowser.open('http://www.google.com', '_blank');

ref.addEventListener('loadstop', () => {
  console.log('loadstop has been fired'); // this fires

  // when this has been executed, `webkit` variable doesn't exist inside of the `inappbrowser`
  // instance
  ref.executeScript({
    code: `(() => {
      var message = "TESTING!!!";
      webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify(message));
    })()`
  });
});

// this is never fired
ref.addEventListener('message', (...args) => {
  console.log('MESSAGE RECEIVED FROM IN_APP_BROWSER', ...args);
});
like image 817
Detuned Avatar asked Feb 11 '19 08:02

Detuned


People also ask

How do I open Cordova in InAppBrowser?

window.open = cordova.InAppBrowser.open; If you change the browsers window.open function this way, it can have unintended side effects (especially if this plugin is included only as a dependency of another plugin). The InAppBrowser window behaves like a standard web browser, and can't access Cordova APIs.

How does the InAppBrowser work?

The InAppBrowser window behaves like a standard web browser, and can't access Cordova APIs. For this reason, the InAppBrowser is recommended if you need to load third-party (untrusted) content, instead of loading that into the main Cordova webview. The InAppBrowser is not subject to the whitelist, nor is opening links in the system browser.

How to use InAppBrowser window open with existing window?

Existing window.open () calls can use the InAppBrowser window, by replacing window.open: If you change the browsers window.open function this way, it can have unintended side effects (especially if this plugin is included only as a dependency of another plugin).

How to enable two-way communication in InAppBrowser?

Step 1: Install InAppBrowser plugin. Step 2: Open your link on click event of any button, or you can do it on any other event. A complete documentation you can find here. The latest version (i.e. 3.1.0) support two way communication and it's also documented properly.


1 Answers

The documentation is pointing to a version that has not yet been released. I pointed to the 3.1.0-dev version of this package and the implementation works like a charm.

like image 196
Detuned Avatar answered Sep 20 '22 03:09

Detuned