flutter可以开发HTML5,Flutter建立JsBridge用于webview与h5通信

项目背景

随着项目的不断完善，需要做一些运营活动，通常是H5页面，在app中打开这些H5页面就需要引入WebView，有时候H5需要客户端提供一些内部的接口，这时候我们就需要建立JSBridge用于客户端与H5之间的通讯。

使用

1、安装webview_flutter

webview_flutter: ^0.3.16

在android中添加网络权限，目录android/app/src/main/AndroidManifest.xml

3、 ios中在ios/Runner/Info.plist中添加

io.flutter.embedded_views_preview

YES*

4、建立JSBridge

需要与H5开发约定协议，建立Model

/// WebView与h5进行通信

class JsBridge {

String method; // 方法名

Map data; // 传递数据

Function success; // 执行成功回调

Function error; // 执行失败回调

JsBridge(this.method, this.data, this.success, this.error);

/// jsonEncode方法中会调用实体类的这个方法。如果实体类中没有这个方法，会报错。

Map toJson() {

Map map = new Map();

map["method"] = this.method;

map["data"] = this.data;

map[