JavascriptChannels is not supported？ I want js to call flutter's method #370
Comments
|
Yes, there are! Support has been added from version You can use Example Flutter side: class Foo {
String bar;
String baz;
Foo({this.bar, this.baz});
Map<String, dynamic> toJson() {
return {
'bar': this.bar,
'baz': this.baz
};
}
}
// ... your widget code ...
onWebViewCreated: (InAppWebViewController controller) {
webView = controller;
controller.addJavaScriptHandler(handlerName:'handlerFoo', callback: (args) {
return Foo(bar: 'bar_value', baz: 'baz_value');
});
controller.addJavaScriptHandler(handlerName: 'handlerFooWithArgs', callback: (args) {
print(args[0]);
print(args[1]);
print(args[2]);
print(args[3]);
print(args[4]);
});
},JavaScript side: <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>InAppWebViewJavaScriptHandlerTest</title>
</head>
<body>
<h1>InAppWebViewJavaScriptHandlerTest</h1>
<script>
// You need to listen the "flutterInAppWebViewPlatformReady", otherwise it could not work properly!
// Another way is to make sure that the page has been loaded and the DOM is ready!
window.addEventListener("flutterInAppWebViewPlatformReady", function(event) {
// call Flutter JavaScript handler callback!
window.flutter_inappwebview.callHandler('handlerFoo').then(function(result) {
// use the "result" coming from Flutter side and call the other Flutter JavaScript handler callback and send arguments!
window.flutter_inappwebview.callHandler('handlerFooWithArgs', 1, true, ['bar', 5], {foo: 'baz'}, result).then(function(result) { });
});
});
</script>
</body>
</html> |
|
I think, it should be noted on documentation that addJavaScriptHandler should be called at onWebViewCreated. I tried putting addJavaScriptHandler at another event handler, it does not work. also, |
|
you can use The important thing is that you need to add your javascript handlers before you use them inside your html-css-js side if you want intercept that calls. So,
Please, take a look at the "About the JavaScript handler" section. window.addEventListener("flutterInAppWebViewPlatformReady", function(event) {
console.log("ready");
});Also, |
returns undefined in my case. fresh flutter project, latest inappwebview. |
|
Could you post your full code? Flutter and html+css+js code, thanks |
|
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug and a minimal reproduction of the issue. |
**Flutter version:1.17.0
Plugin version: 3.2.0
The text was updated successfully, but these errors were encountered: