WebView加载html图片不显示问题

hackernew
发布于 2021-2-25 09:53
浏览
0收藏

近期在项目中出现了一个问题,WebView加载html时,部分图片显示不出来,一直显示裂图,多方搜索,可能是因为http和https的混合问题。

 

原因


在Android5.0 以及以上的系统,当WebView加载的链接为Https开头,但是链接里面的内容,比如图片为Http链接,这时候,图片就会加载不出来。

这个是http和https的混合问题。而且只会在Android5.0及以上的出现。那是因为从Android5.0开始,WebView默认不支持同时加载Https和Http混合模式。

 

分析

 

从Android5.0以后,当一个安全的站点(https)去加载一个非安全的站点(http)时,需要配置Webview加载内容的混合模式,一共有如下三种模式:

  • MIXED_CONTENT_NEVER_ALLOW:Webview不允许一个安全的站点(https)去加载非安全的站点内容(http),比如,https网页内容的图片是http链接。强烈建议App使用这种模式,因为这样更安全。
  • MIXED_CONTENT_ALWAYS_ALLOW:在这种模式下,WebView是可以在一个安全的站点(Https)里加载非安全的站点内容(Http),这是WebView最不安全的操作模式,尽可能地不要使用这种模式。
  • MIXED_CONTENT_COMPATIBILITY_MODE:在这种模式下,当涉及到混合式内容时,WebView会尝试去兼容最新Web浏览器的风格。一些不安全的内容(Http)能被加载到一个安全的站点上(Https),而其他类型的内容将会被阻塞。这些内容的类型是被允许加载还是被阻塞可能会随着版本的不同而改变,并没有明确的定义。这种模式主要用于在App里面不能控制内容的渲染,但是又希望在一个安全的环境下运行。 

 

在Android5.0以下,默认是采用的MIXED_CONTENT_ALWAYS_ALLOW模式,即总是允许WebView同时加载Https和Http;而从Android5.0开始,默认用MIXED_CONTENT_NEVER_ALLOW模式,即总是不允许WebView同时加载Https和Http。

 
作者:Json森
来源:CSDN

 

 

解决方案


在webview加载页面之前,设置加载模式为:
MIXED_CONTENT_ALWAYS_ALLOW(不太安全),

或者
MIXED_CONTENT_COMPATIBILITY_MODE(个人建议)。

另外在webview设置中还可以加上另外一个设置:

websettings.setBlockNetworkImage(false);

 

加上混合内容模式设置,代码如下:

/*解决图片不显示*/
websettings.setBlockNetworkImage(false);//不阻塞网络图片
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    //允许混合(http,https)
	//websettings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
    websettings.setMixedContentMode(WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE);
}

 

通过上面的设置,发现有些图片仍然不能显示。又经过多方搜索,发现了其他问题。

 

图片不显示原因还有可能是证书问题。

 

只要涉及到https,大家都会第一时间想到证书验证。当然,这是没问题的。如果有要求,这个证书验证是必须的。一般情况下,都是需要证书的(有证书毕竟安全些)。

 
Android WebView组件加载网页发生证书认证错误时,会调用WebViewClient类的onReceivedSslError方法,在这个方法里,我们可以点击源码看到SslErrorHandler中有两个主要的方法可以调用

【1】cancel( ):停止加载问题页面
【2】proceed( ):忽略SSL证书错误,继续加载页面

 

 

如果我们不考虑证书安全,则可以直接这样写

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
        handler.proceed();//接受所有网站的证书
    }
});

 

分类
已于2021-2-25 09:53:51修改
收藏
回复
举报
1条回复
按时间正序
/
按时间倒序
麒麟Berlin
麒麟Berlin

鸿蒙中webview如何添加httpheaders, api中只找到public ResourceResponse processResourceRequest(WebView webView, ResourceRequest request),尝试试着加了小貌似没作用

 

回复
2021-5-22 16:43:16
回复
    相关推荐