Flutter中webview添加图片的长按操作

开发过程工我们会用webview显示一些活动或是变动比较频繁的页面,若是webview中包含图片,一般会有保存图片的需求,我们可以采用js交互的形式获取图片的url,话不多说直接看操作

/// 这个手势要加在整个webview上

GestureDetector(
        onLongPressStart: (LongPressStartDetails longPress) async {
          String imgUrl =
              'document.elementFromPoint(${longPress.localPosition.dx}, ${longPress.localPosition.dy}).src';
          webViewController.evaluateJavascript(imgUrl).then((value) async {
            if (value.safeString.length > 0 &&
                value.safeString.startsWith('http')) {
              print('我获取到了====$value'); 
            }
          });
        },
        child:WebView())

获取点击位置的element,中的src值,即可

补充问题
1、在安卓设备上发现长按手势并没有调用，翻看 webview_flutter发现需要设置安卓的类型，展示webview之前设置

if (Platform.isAndroid) {
    WebView.platform = SurfaceAndroidWebView();
  }

2、获取到的url也就是开始返回的value值，安卓会带有”“，需要自行去掉