最近两个月一直在研究Flutter项目,目的是为了开发一款Flutter应用去替换之前的Android和IOS应用。
一开始都有条不紊地进行着,直到遇到一个坑,原先的项目使用了大量的H5,利用android和IOS中的Webview去加载这些链接,其中就避免不了JS的交互,我知道android和IOS都支持addJavascriptInterface的方法去暴露一个对象给JS,这样JS就可以直接调用原生的一些方法。
Android实现方法:webview.addJavascriptInterface(new JSInterface(), "nativeApis");
IOS实现方法:JSInterface* interface = [JSInterface new];
[self.myWebView addJavascriptInterfaces:interface WithName:@"nativeApis"];
这样JS代码就可以直接使用nativeApis.getXXX()去调用原生方法。
为了不去修改那些H5项目,在Flutter项目中,我也必须实现类似方法,但Flutter的webview并不支持类似机制,要想调用Flutter的方法,就必须修改js的调用方法,将nativeApis.getXXX()改成getXXX.postMessage(),所以想在这里问问大家,有没有什么办法可以解决我的问题?
----------------------------------------------------时间线-----------------------------------------------------
经过了一段时间的摸索,倒是想到一个方法,利用platformview去创建android和ios的webview,然后用UiKitView或者AndroidView在Flutter项目中使用,需要注意的是,ios的WKWebView需要重写,因为他并不直接支持addJavascriptInterfaces这个方法,我用的是github上的开源项目EasyJSWebView,接下来,我要考虑如何在android和ios中调用flutter的方法,MethodChannel刚好可以实现这个功能。
https://blog.csdn.net/mhtios/article/details/98608694#commentsedit
https://github.com/dukeland/EasyJSWebViewSample
这个思路可以完成上述的需求,但过程比较复杂,如果有更好的办法,希望大家可以在下方评论。