android低版本系统部分手机加载不出H5页面

5 篇文章 0 订阅

我这个问题出现在android6.0以下的机子上,  其他版本没问题。

解决方法(前三种方法需要Android同学改,第四种需要web前端同学改):

1.启用mixed content
在Android5.0中,WebView方面做了些修改,如果你的系统target api为21以上:

系统默认禁止了mixed content和第三方cookie。可以使用setMixedContentMode() 和 setAcceptThirdPartyCookies()以分别启用。
系统现在可以智能选择HTML文档的portion来绘制。这种新特性可以减少内存footprint并改进性能。若要一次性渲染整个HTML文档,可以调用这个方法enableSlowWholeDocumentDraw()
如果你的app的target api低于21:系统允许mixed content和第三方cookie,并且总是一次性渲染整个HTML文档。 
在使用WebView的类中添加如下代码:

/**
 * 启用mixed content    android 5.0以上默认不支持Mixed Content
 *
 * 5.0以上允许加载http和https混合的页面(5.0以下默认允许,5.0+默认禁止)
 * */
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
}

2.适配https的ssl证书问题

public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
        handler.proceed();  // 接受所有网站的证书
//        super.onReceivedSslError(view, handler, error);
    }

3.设置适应Html5

/**设置适应Html5的一些方法*/
webView.getSettings().setDomStorageEnabled(true);

4.如果页面代码使用了es6 promise等新特性,可能要引入一些js文件去兼容低版本

<script src="./js/babel.min.js"></script>
  <script src="./js/bluebird.min.js"></script>

或者通过npm的方式安装依赖:

1.npm install babel-polyfill es6-promise --save;

2.main.js 引入

3.入口文件修改webpack.base.conf.js

我的代码里就引入这两个js文件,这样即使低版本Android系统的webview浏览器也能正常解析这些es6代码,如果还不行或者大家还有其他方法,欢迎留言区讨论!

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值