Flutter|【Flutter】Android原生WebView（非Flutter WebView）与FlutterWeb交互 webview|flutter|FlutterWeb|android

原生WebView通过url来加载FlutterWeb项目。
注意：分为两个项目，一个是Android原生项目，一个是FlutterWeb项目。Android原生通过WebView加载FlutterWeb项目
Android原生以下内容在Android原生项目上更改。

依赖

【Flutter|【Flutter】Android原生WebView（非Flutter WebView）与FlutterWeb交互】WebView使用DsBridge-Android，添加依赖如下：

implementation 'com.github.wendux:DSBridge-Android:3.0-SNAPSHOT'

项目级别build.gradle

maven { url 'https://jitpack.io' }

布局

MainActivity.kt

class MainActivity : AppCompatActivity() {var mBinding: ActivityMainBinding? = null override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState)mBinding = DataBindingUtil.setContentView(this, R.layout.activity_main)mBinding?.btn?.setOnClickListener { val intent = Intent(this@MainActivity, MyFlutterActivity::class.java) startActivity(intent) } mBinding?.dWebView?.settings?.let { it.userAgentString = it.userAgentString + "winit" it.allowUniversalAccessFromFileURLs = true it.allowFileAccessFromFileURLs = true it.allowContentAccess = true it.allowFileAccess = true it.mixedContentMode = WebSettings.MIXED_CONTENT_ALWAYS_ALLOW it.javaScriptEnabled = true } val map: HashMap, String> = HashMap, String>() map.put("test", "ddddd") mBinding?.dWebView?.addJavascriptInterface(JsBridge(this),"test") mBinding?.dWebView?.loadUrl("http://10.199.17.135:8080/web/index.html", map)}

JsBridge

class JsBridge(val context: Context) {@JavascriptInterface fun hello(msg: String?): String { println("test") Toast.makeText(context, "test$msg", Toast.LENGTH_SHORT).show() return "Android native test" } }

FlutterWeb 以下内容在FlutterWeb上更改

编写js代码

文章图片

function flutterGetJs(text){ //test为客户端传递过来的namespace，hello为客户端的方法 var result = test.hello("js调用了android中的hello方法"); return result; }

js在index.html中注册

文章图片

src="https://www.it610.com/article/js/config.js" type="application/javascript">

flutter调用

class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); // This widget is the root of your application. @override Widget build(BuildContext context) {//调用js代码 var result = js.context.callMethod("flutterGetJs",["123"]); Fluttertoast.showToast(msg: result); return MaterialApp( debugShowCheckedModeBanner: false, title: 'default', theme: ThemeData( // This is the theme of your application. // // Try running your application with "flutter run". You'll see the // application has a blue toolbar. Then, without quitting the app, try // changing the primarySwatch below to Colors.green and then invoke // "hot reload" (press "r" in the console where you ran "flutter run", // or simply save your changes to "hot reload" in a Flutter IDE). // Notice that the counter didn't reset back to zero; the application // is not restarted. primarySwatch: Colors.blue, ), home: ProviderTestPage01(), routes: routeTable, ); } }