html - Angular/HTML5 到 iOS WKWebView 通信

Question

我们正在尝试了解向 Angular 6、HTML5 项目向 iOS WKWebView 发送信号的最佳选择是什么。 p>

任何示例都会很棒。

我们正在努力做的是:我们在 Angular 网页上有一个按钮，单击该按钮应该通知 iOS 执行某些操作。 我们在 iOS WKWebView 中加载 Angular 页面。

引用Angular 5 and native IOS/Android communication ，不是很清楚。如果 ios 和 Angular 方面都有可用的示例，那就太好了。

Answer 1

Apple 在 WebKit 中提供了一种机制，用于将消息从 HTML 发送到 native :

在您的 HTML 页面中，调用:

window.webkit.messageHandlers.messageHandler.postMessage("Pass your data here...");

其中，messageHandler 是您的 iOS 代码中收到的消息的名称。 “在此处传递您的数据...” 是通过 messageHandler 消息传递到 iOS 的数据。

在您的 iOS 代码中:

使用 WKUserContentController 的 add(_:name:) 方法添加消息处理程序，如下所示:

webView.configuration.userContentController.add(self, name: "messageHandler")

最后，在您的 ViewController 代码中实现 WKScriptMessageHandler 的 userContentController:didReceiveScriptMessage: 方法，如下所示:

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
     if message.name == "messageHandler" {
          // Your Message handler code goes here...            
     }

根据 add(_:name:) 方法的 Apple 文档:

Adding a script message handler with name name causes the JavaScript function window.webkit.messageHandlers.name.postMessage(messageBody) to be defined in all frames in all web views that use the user content controller.

Apple Documentation link