HarmonyOS鸿蒙Next中flutter使用webview_flutter包,js如何和webview_flutter通讯
HarmonyOS鸿蒙Next中flutter使用webview_flutter包,js如何和webview_flutter通讯 flutter框架,使用webview_flutter包,js如何和webview_flutter通讯?
我已经知道webview_flutter的controller有addJavaScriptChannel方法可以监听js的方法调用,在鸿蒙中js该怎么调用到原生函数?
例如在Android中,webView首先注册方法A,js调用window.Android.methodA()即可调用到刚才注册的方法A原生函数。在iOS中,webView调用addScriptMessageHandler:name:方法注册函数A的名字,js调用window.webkit.messageHandlers[methodA].postMessage()即可调用到iOS的刚才注册的方法A原生函数。
更多关于HarmonyOS鸿蒙Next中flutter使用webview_flutter包,js如何和webview_flutter通讯的实战教程也可以访问 https://www.itying.com/category-92-b0.html
鸿蒙中js与dart函数的调用,请参考如下demo:https://gitee.com/openharmony-sig/flutter_samples/tree/master/ohos/js_dart_demo
更多关于HarmonyOS鸿蒙Next中flutter使用webview_flutter包,js如何和webview_flutter通讯的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
在鸿蒙 import
{ webview } from
'@kit.ArkWeb'
中 js如何和webview如何通信?IOS 中 [web addScriptMessageHandler:self name:@"eventName"];
添加监听 ,代理方法 - (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
即可拿到 message.name = 'eventName'
事件 ;有尝试使用// Web组件加载本地index.html页面 Web({ src: $rawfile(‘index.html’), controller: this.webviewController}) // 将对象注入到web端 .javaScriptProxy({ object: this.testObj, name: "testObjName", methodList: ["test","gettest1"], controller: this.webviewController })
} } ,加载的是压缩后的 .html,这个 testObjName
一直找不到
在HarmonyOS鸿蒙Next中使用webview_flutter
包时,JavaScript与WebView的通讯可以通过以下方式实现:
-
JavaScript调用Flutter:
- 使用
javascriptChannels
在Flutter中注册JavaScript通道,允许JavaScript通过该通道调用Flutter方法。 - 例如:
WebViewController controller = WebViewController() ..setJavaScriptMode(JavaScriptMode.unrestricted) ..addJavaScriptChannel('FlutterChannel', onMessageReceived: (JavaScriptMessage message) { // 处理来自JavaScript的消息 });
- 在JavaScript中调用:
FlutterChannel.postMessage('Hello from JavaScript');
- 使用
-
Flutter调用JavaScript:
- 使用
runJavaScript
方法在Flutter中执行JavaScript代码。 - 例如:
controller.runJavaScript('alert("Hello from Flutter")');
- 使用
-
双向通讯:
- 结合上述两种方式,可以实现Flutter与JavaScript之间的双向通讯。
- 例如,JavaScript发送消息到Flutter,Flutter处理后返回结果给JavaScript。
-
注意事项:
- 确保WebView的JavaScript支持已启用。
- 处理消息时注意安全性,避免注入攻击。
通过以上方式,可以在HarmonyOS鸿蒙Next中实现webview_flutter
与JavaScript的通讯。
在HarmonyOS鸿蒙Next中使用webview_flutter
包时,可以通过JavaScript与Flutter进行通信。具体步骤如下:
- 启用JavaScript:在
WebViewController
中启用JavaScript支持。 - 注册JavaScript回调:使用
JavaScriptChannel
注册回调方法,Flutter可以通过此方法接收来自JavaScript的消息。 - 发送消息:在JavaScript中使用
window.flutter_inappwebview.callHandler
方法发送消息到Flutter。 - 处理消息:在Flutter中通过注册的
JavaScriptChannel
处理接收到的消息并执行相应操作。
这样即可实现JavaScript与webview_flutter
的双向通信。