从 Angular Web 应用程序广播事件并在 IONIC 应用程序中接收

【问题标题】：Broadcast event from Angular web app and receive in IONIC application从 Angular Web 应用程序广播事件并在 IONIC 应用程序中接收
【发布时间】：2020-01-10 10:12:27
【问题描述】：

我有一个 IONIC 应用程序，它使用 InAppBrowser 使用我的 Angular Web 应用程序。我想从 Angular Web 应用程序触发一个事件并从 IONIC 应用程序打开相机。目前，我正在使用 InAppBrowser 打开我的 Angular Web 应用程序。谁能向我建议实现这一目标的最佳方法是什么？

我尝试了 postMessage、Event、window.addEventListener 但没有成功

我需要将我当前的 Angular Web 应用程序集成到 IONIC 移动应用程序中，并将 Cordova 插件与 Angular Web 应用程序一起使用。

【问题讨论】：

标签： javascript angular ionic-framework observable inappbrowser

【解决方案1】：

您可以尝试实现 postCordovaMessage，它必须可用于使用 Cordova 创建的 InAppBrowser 窗口。

在你的APP中添加消息监听器：

const browser = this.inAppBrowser.create('https://.....');
browser.on('message').subscribe(event => {
     if (message.data.action === 'openCamera') {
          // open camera
     }
});

在您的 WEB 中发送消息：

var message = {action: 'openCamera'};
if (webkit.messageHandlers.cordova_iab) { 
     webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify(message));
}

如果您的 WEB 页面只需要为 WEB 页面功能捕获图像，那么您可以尝试对输入元素使用 HTML5 捕获属性：

<input type="file" accept="image/*" capture >

【讨论】：