如何将自定义消息从我的应用程序浏览器发送到我的离子应用程序

Question

我正在尝试将自定义有效负载从 inAppBrowser 内的 js 发送到我的离子应用程序。我已经知道如何使用以下方法将数据发送到 inAppbrowser：

iab.executeScript({code:`alert(2)`});

但是发回数据没有正确记录，在 github 网站上我看到：

inAppBrowserRef.addEventListener('message', messageCallBack);

上面只展示了如何让你的ionic接收它，但没有展示javascript如何发送它。我需要有关如何让 inAppbrowser 发送此自定义消息的帮助。

Answer 1

import { Component } from '@angular/core';
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  ref: InAppBrowser;
  constructor(private iab: InAppBrowser) {

  }

  openBlank() {

    var payload = JSON.stringify({
      "currency": "",
      "exp": "",
      "success_title": "",
      "success_message": ""
    })

    var init = false;
    
    var ref = this.iab.create('https://random.com/', '_blank', 'location=yes');
    ref.on('loadstop').subscribe(event => {
      if(!init){
        console.log(' jeffery received')
        //ref.executeScript({ code: "webkit.messageHandlers.cordova_iab.postMessage('"+payload+"')" });
        ref.executeScript({ code: "jsFunction('" + payload + "');" });
        init = true;
      }
    });

    ref.on('message').subscribe((event) => {

      const postObject:any = event
       console.log(postObject.data.type)
       console.log(JSON.stringify(postObject.data))
    })

    ref.on('loadstart').subscribe(event => {
      if(init){
        var shouldClose = this.getUrlParameter(event.url.replace(/%22/g, "\""), "shouldClose");
        if(shouldClose){
          var data = this.getUrlParameter(event.url.replace(/%22/g, "\""), "data");
          var jsonObj = JSON.parse(data);
          ref.close();
        }
      }
    });
  }

   getUrlParameter = (url, name) => {
    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
    var results = regex.exec(url);
    return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
  }

  openSystem() {
    this.iab.create(`https://jamibot.com`, `_system`);
  }


}

Answer 2

如果App中打开的子页面在您的控制范围内，您可以将其放入网页中

网页内

window.parent.postMessage({msg : 'I am message'}, '*');

应用内

window.onmessage = (event) => {
    console.log('event received in app', event);
}