【Flutter】 webview_flutter避坑

新镜

已于 2024-07-29 15:22:04 修改

阅读量505

点赞数 10

文章标签： flutter

于 2024-07-16 21:00:00 首次发布

本文链接：https://blog.csdn.net/lxjlxj2333/article/details/140290999

版权

webview_flutter

webview_flutter没有SSL Error接口，也就是说等你的网页出现SSL 错误的时候这个插件无法捕捉处理，除非你改它的源码。

下面这段是webview_flutter官网的例子，它有onHttpError、onWebResourceError、但没有任何捕捉 SSL 错误的选项，我曾经不信邪找了很久。

controller = WebViewController()
  ..setJavaScriptMode(JavaScriptMode.unrestricted)
  ..setBackgroundColor(const Color(0x00000000))
  ..setNavigationDelegate(
    NavigationDelegate(
      onProgress: (int progress) {
        // Update loading bar.
      },
      onPageStarted: (String url) {},
      onPageFinished: (String url) {},
      onHttpError: (HttpResponseError error) {},
      onWebResourceError: (WebResourceError error) {},
      onNavigationRequest: (NavigationRequest request) {
        if (request.url.startsWith('https://www.youtube.com/')) {
          return NavigationDecision.prevent;
        }
        return NavigationDecision.navigate;
      },
    ),
  )
  ..loadRequest(Uri.parse('https://flutter.dev'));

通过日志发现可以取巧提醒SSL Error ， SSL Error不会走onPageStarted,可以在这里加flag，然后在pageFinished的时候做判断即可。

flutter_inappwebview

但是另一个webview的插件flutter_inappwebview可以捕捉，这个插件感觉接口更多一点。

SSL Error接口使用onReceivedServerTrustAuthRequest捕捉。

                InAppWebView(
                      key: webViewKey,
                      initialUrlRequest: URLRequest(url: WebUri("https://www.baidu.com/?tn=02003390_20_hao_pg")),
                      initialSettings: settings,
                      pullToRefreshController: pullToRefreshController,
                      onWebViewCreated: (controller) {
                        webViewController = controller;
                      },
                    onReceivedServerTrustAuthRequest: (controller, challenge) async {
                      //解决 handshake failed问题
                      print("onReceivedServerTrustAuthRequest $challenge");
                      return ServerTrustAuthResponse(
                          action: ServerTrustAuthResponseAction.PROCEED);
                    },
                      onLoadStart: (controller, url) {
                        setState(() {
                          this.url = url.toString();
                          urlController.text = this.url;
                        });
                      },
                      onPermissionRequest: (controller, request) async {
                        return PermissionResponse(
                            resources: request.resources,
                            action: PermissionResponseAction.GRANT);
                      },
                        shouldOverrideUrlLoading:
                          (controller, navigationAction) async {
                        var uri = navigationAction.request.url!;
                        return NavigationActionPolicy.ALLOW;
                      },
                      onLoadStop: (controller, url) async {
                        pullToRefreshController?.endRefreshing();
                        setState(() {
                          this.url = url.toString();
                          urlController.text = this.url;
                        });
                      },
                      onReceivedError: (controller, request, error) {
                        pullToRefreshController?.endRefreshing();
                      },
                      onProgressChanged: (controller, progress) {
                        if (progress == 100) {
                          pullToRefreshController?.endRefreshing();
                        }
                        setState(() {
                          this.progress = progress / 100;
                          urlController.text = url;
                        });
                      },
                      onUpdateVisitedHistory: (controller, url, androidIsReload) {
                        setState(() {
                          this.url = url.toString();
                          urlController.text = this.url;
                        });
                      },
                      onConsoleMessage: (controller, consoleMessage) {
                        if (kDebugMode) {
                          print(consoleMessage);
                        }
                      },
                    ),

坑+1

webview_flutter跟flutter_inappwebview不能一起用，不然使用flutter_inappwebview的页面会无法加载，报Android issue: Unknown feature SUPPRESS_ERROR_PAGE, webview not displaying at all的错