Flutter中使用webview_flutter遇到的https和http混用问题(Android)

一、前言

目前在Android5.0上面对WebView的使用默认链接是https的,如果混合使用的话会出现问题,在Android上面的话还好解决一点,但是由于Flutter提供的webView插件貌似没有考虑到这个问题,所以就要改动源码来进行解决了。
在使用过程中遇到的错误大体如下(为了能清晰表达问题,里面链接已经修改过了),大致意思是必须使用https,这个错误不会爆红,遇到的时候需要注意。

“Mixed Content: The page at ‘https://www.baidu.com/’ was loaded over HTTPS, but requested an insecure video ‘http://www.sina.com’. This request has been blocked; the content must be served over HTTPS.”, source: https://www.baidu.com

解决方式主要有两步:
1、通过网络配置把https配置好,如果域名不确定的话,只能在配置时候放过所有https的域名了。
2、修改webview_flutter插件中的FlutterWebView源码,本文使用时候插件最新版本为1.0.7,该代码是在该基础上进行修改。

ps: 插件市场:https://pub.flutter-io.cn/packages/webview_flutter

二、查找源文件

修改的源码如下(最好使用Android Studio打开,因为有代码关联功能,否则的话代码不好找到):
1、使用Android Studio打开Flutter项目中的Android部分
2、打开android->app->src->main->java->io->flutter->plugins->GeneratedPluginRegistrant.java
这个路径文件是系统生成的,一般不会变,如果依赖过webview_flutter插件后,代码结构大体如下:
在这里插入图片描述
可以看到WebViewFlutterPlugin插件,打开插件,插件内容会包含如下内容:

主要看onAttachedToEngine(FlutterPluginBinding binding)函数即可,关键代码会在这里,其它自定义View的插件也是如此,后续流程皆是如此
在这里插入图片描述

在这里打开WebViewFactory文件,关键代码如下:

主要看create(Context context, int id, Object args)返回值部分
在这里插入图片描述

然后打开FlutterWebView文件,主要修改方式如下(代码还行,主要找到关键点WebSetting就好):

在这里插入图片描述

三、新增部分的代码

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {//5.0以上强制启用https和http混用模式
  webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}

四、后续

由于该文件是.pub-cache缓存位置的文件,所以修改过后,如果清理缓存或者版本更新后,这个代码可能会消失,所以记得上述流程就显得很有必要。对于该流程的详细理解可以参考以下链接:
https://blog.csdn.net/Mr_Tony/article/details/111246269

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值