Web Support: addJavaScriptHandler / callHandler not supported ? (even in same Origin)

[fvisticot]

• [x] I have read the Getting Started section
• [x] I have already searched for the same problem

Environment

Technology	Version
Flutter version	3.10.2
Plugin version
Android version
iOS version
macOS version
Xcode version
Web browser	chrome

Device information:

Description

I try basic example with Same Frame Origin I'm not able to make the "addJavascriptHandler" (from Flutter) and callHandler(from JS). In the web_support.js, I do not see any trace of callHandler method and "flutterInAppWebViewPlatformReady" event to check if platform is ready

Is it planned to work in next release or it is not possible to make it works ?

Expected behavior:

Current behavior:

Steps to reproduce

1. This
2. Than that
3. Then

Images

Stacktrace/Logcat

[github-actions[bot]]

👋 @fvisticot

NOTE: This comment is auto-generated.

Are you sure you have already searched for the same problem?

Some people open new issues but they didn't search for something similar or for the same issue. Please, search for it using the GitHub issue search box or on the official inappwebview.dev website, or, also, using Google, StackOverflow, etc. before posting a new one. You may already find an answer to your problem!

If this is really a new issue, then thank you for raising it. I will investigate it and get back to you as soon as possible. Please, make sure you have given me as much context as possible! Also, if you didn't already, post a code example that can replicate this issue.

In the meantime, you can already search for some possible solutions online! Because this plugin uses native WebView, you can search online for the same issue adding android WebView [MY ERROR HERE] or ios WKWebView [MY ERROR HERE] keywords.

Following these steps can save you, me, and other people a lot of time, thanks!

[LucaIaconelli]

Is there any news regarding this issue?

[ajayld]

I'm using v6.0.0-beta.17 for the flutter_inappwebview plugin. The addJavaScriptHandler API documentation also does not mention the Web as a supported platform. I am getting an exception saying - Error: UnimplementedError: addJavaScriptHandler is not implemented on the current platform.

Is there an ETA for supporting this API on the Web platform?

[guidotheelen]

It would be great to have this 💯

[sdivakarrajesh]

Figured out a way to do this on same origin

In the dart side you can use this instead of the addJavaScriptHandler

import 'dart:html' as html;

html.window.addEventListener('message', (event) {
  final messageEvent = event as html.MessageEvent;
  print("Got a message ${messageEvent.data}");
});

In the js side

function sendMessageToContainer(message) {
  if (inIframe) {
    window.top.postMessage(message);
  } else {
    if (window.flutter_inappwebview) {
      window.flutter_inappwebview.callHandler(message);
    } else {
      console.log('not in an iframe and no flutter binding found');
    }
  }
}

[MichaelSSY]

找到了一种在同源上做到这一点的方法

在 dart 端你可以使用它来代替 addJavaScriptHandler

import 'dart:html' as html;

html.window.addEventListener('message', (event) {
  final messageEvent = event as html.MessageEvent;
  print("Got a message ${messageEvent.data}");
});

在js端

function sendMessageToContainer(message) {
  if (inIframe) {
    window.top.postMessage(message);
  } else {
    if (window.flutter_inappwebview) {
      window.flutter_inappwebview.callHandler(message);
    } else {
      console.log('not in an iframe and no flutter binding found');
    }
  }
}

A great method, but there is a problem that every time you click on a JS event, it will be called back 8 times, which is terrifying. May I ask if there is a solution?