当前位置: 移动技术网 > IT编程>移动开发>Android > Android在项目中接入腾讯TBS浏览器WebView的教程与注意的地方

Android在项目中接入腾讯TBS浏览器WebView的教程与注意的地方

2019年08月02日  | 移动技术网IT编程  | 我要评论

外星人理财官网,重生丑小鸭也有春天,2011年节假日安排

腾讯tbs浏览器服务

我们都知道,在android开发中,经常会用到webview,而且webview是出了名的坑的,各种bug。这时候腾讯老哥站出来了,搞了一个tbs浏览器服务这个东西。 说得这么屌,其实就是一个webview控件,然后解析解析网页的内核是他自己做的,叫x5内核(系统原生的webview用的是webkit内核),所以我们开发者用的时候,主要就是用这个com.tencent.smtt.sdk.webview控件

当然这个控件有很多功能,当然也有些要注意的地方。

官网地址:http://x5.tencent.com

1. 特殊功能:

  • 速度快:相比系统webview的网页打开速度有30+%的提升;
  • 省流量:使用云端优化技术使流量节省20+%;
  • 更安全:安全问题可以在24小时内修复;
  • 更稳定:经过亿级用户的使用考验,crash率低于0.15%;
  • 兼容好:无系统内核的碎片化问题,更少的兼容性问题;
  • 体验优:支持夜间模式、适屏排版、字体设置等浏览增强功能;
  • 功能全:在html5、es6上有更完整支持;
  • 更强大:集成强大的视频播放器,支持视频格式远多于系统webview;
  • 视频和文件格式的支持x5内核多于系统内核
  • 防劫持是x5内核的一大亮点

2. 运行环境

  • 手机rom版本高于或等于2.2版本
  • 手机ram大于500m,该ram值通过手机 /proc/meminfo 文件的memtotal动态获取

注:如果不满足上述条件,sdk会自动切换到系统webview,sdk使用者不用关心该切换过程。

3. sdk尺寸指标

  • sdk提供的jar包约293k

4. 原生和x5 webview的类对应表

                          系统内核                                                                                sdk内核

  • android.webkit.consolemessage                  com.tencent.smtt.export.external.interfaces.consolemessage
  • android.webkit.cachemanager                       com.tencent.smtt.sdk.cachemanager(deprecated)
  • android.webkit.cookiemanager                      com.tencent.smtt.sdk.cookiemanager
  • android.webkit.cookiesyncmanager              com.tencent.smtt.sdk.cookiesyncmanager
  • android.webkit.customviewcallback com.tencent.smtt.export.external.interfaces.ix5webchromeclient.customviewcallback
  • android.webkit.downloadlistener                  com.tencent.smtt.sdk.downloadlistener
  • android.webkit.geolocationpermissions com.tencent.smtt.export.external.interfaces.geolocationpermissionscallback
  • android.webkit.httpauthhandler                     com.tencent.smtt.export.external.interfaces.httpauthhandler
  • android.webkit.jspromptresult                      com.tencent.smtt.export.external.interfaces.jspromptresult
  • android.webkit.jsresult                                   com.tencent.smtt.export.external.interfaces.jsresult
  • android.webkit.sslerrorhandler                      com.tencent.smtt.export.external.interfaces.sslerrorhandler
  • android.webkit.valuecallback                         com.tencent.smtt.sdk.valuecallback
  • android.webkit.webbackforwardlist            com.tencent.smtt.sdk.webbackforwardlist
  • android.webkit.webchromeclient                 com.tencent.smtt.sdk.webchromeclient
  • android.webkit.webhistoryitem                      com.tencent.smtt.sdk.webhistoryitem
  • android.webkit.webicondatabase                 com.tencent.smtt.sdk.webicondatabase
  • android.webkit.webresourceresponse     com.tencent.smtt.export.external.interfaces.webresourceresponse
  • android.webkit.websettings                           com.tencent.smtt.sdk.websettings
  • android.webkit.websettings.layoutalgorithm   com.tencent.smtt.sdk.websettings.layoutalgorithm
  • android.webkit.webstorage                            com.tencent.smtt.sdk.webstorage
  • android.webkit.webview                                 com.tencent.smtt.sdk.webview
  • android.webkit.webviewclient                      com.tencent.smtt.sdk.webviewclient

在app中集成

1. 导jar包

去这个网址: ,看到android sdk(完整版) 这个就是jar包,下载回来放到你项目的lib文件夹,右键add as library即可。

2. 权限

在manifest添加下面的权限

<uses-permission android:name="android.permission.write_external_storage" />
<uses-permission android:name="android.permission.access_network_state" />
<uses-permission android:name="android.permission.access_wifi_state" />
<uses-permission android:name="android.permission.internet" />
<uses-permission android:name="android.permission.read_phone_state" />

3. 初始化x5内核

在application里面使用qbsdk.initx5environment进行初始化x5内核,第一个参数传入context,第二个参数传入preinitcallback,不需要callback的可以传入null。
initx5environment内部会创建一个线程向后台查询当前可用内核版本号,这个函数内是异步执行所以不会阻塞 app 主线程,这个函数内是轻量级执行所以对app启动性能没有影响,当app后续创建webview 时就可以首次加载x5内核了:

public class baseapplicatiom extends application {
 @override
 public void oncreate() {
 super.oncreate();
 //初始化x5内核
 qbsdk.initx5environment(this, new qbsdk.preinitcallback() {
 @override
 public void oncoreinitfinished() {
 //x5内核初始化完成回调接口,此接口回调并表示已经加载起来了x5,有可能特殊情况下x5内核加载失败,切换到系统内核。
 }
 @override
 public void onviewinitfinished(boolean b) {
 //x5內核初始化完成的回调,为true表示x5内核加载成功,否则表示x5内核加载失败,会自动切换到系统内核。
 log.e("@@","加载内核是否成功:"+b);
 }
 });
 }
}

4. 使用webview

然后需要用到webview的时候,在布局这样子下面这样子写,注意要全路径com.tencent.smtt.sdk.webview:

<com.tencent.smtt.sdk.webview
 android:id="@+id/twv_test"
 android:layout_width="match_parent"
 android:layout_height="match_parent"/>

其余使用方法基本和系统的webview一样,例如js的交互是,也是一样的addjavascriptinterface,所以使用成本还不算高。但是有些是需要注意的,继续看下去:

高级一点的使用

1. 全屏播放视频

页面的activity需要声明:

android:configchanges="orientation|screensize|keyboardhidden"

视频为了避免闪屏和透明问题,activity在oncreate时需要设置:

//这个对宿主没什么影响,建议声明
getwindow().setformat(pixelformat.translucent);

在非硬绘手机和声明需要controller的网页上,视频切换全屏和全屏切换回页面内会出现视频窗口透明问题,需要在activity的style进行如下设置:

<!-- 声明为不透明,这个视各app情况所需,不强制需求,如果声明了,对体验更有利 -->
<item name="android:windowistranslucent">false</item>。

以下接口禁止(直接或反射)调用,避免视频画面无法显示:

webview.setlayertype()
webview.setdrawingcacheenabled(true);

2. 输入法

避免输入法界面弹出后遮挡输入光标的问题,所在的activity添加属性:

android:windowsoftinputmode="statehidden|adjustresize"

或者 在activityoncreate时候代码设置也行:

getwindow().setsoftinputmode(windowmanager.layoutparams.soft_input_adjust_resize | windowmanager.layoutparams.soft_input_state_hidden);

3. 自定义ua

ua是什么?
useragent,用户代理。是一个特殊字符串头,使得服务器能够识别客户使用的操作系统及版本、cpu 类型、浏览器及版本、浏览器渲染引擎、浏览器语言、浏览器插件等。作用就是告诉网页我这个是什么系统。

如果 app 需要自定义 ua,建议采取在 sdk 默认ua 后追加 app ua 的方式。示例:

//其中app_name_ua是app自定义ua
websetting.setuseragentstring(websetting.getuseragentstring() + app_name_ua);

4. 额外的视频播放器

没错,这货还提供了一个视频播放的功能,下面官方的说明:

tbs不仅提供了强大的网页浏览功能,更提供了强大的页面h5视频播放支持,播放器同时支持页面,小窗,全屏播放体验,强大的解码能力,包括mp4,rmvb,flv,avi等26种视频格式支持。

tbs播放器的播放场景不仅局限于h5页面播放,也可以接入一般的视频流链接,比如本地文件,网络的视频流链接。开发者如果想播放一个视频链接,在不自己开发播放器的前提下,一般做法是将视频的播放链接放到一个intent里面,抛给系统的播放器进行播放,那么当你集成了tbs后,你只需要通过简单的方式接入视频播放调用接口,这样你不需要写任何一句关于播放器的代码,就可以享受一个本地播放器体验,播放视频再不需要intent来跨app、跨进程的调用了。

第一步,在manifest添加activity声明:

<activity
 android:name="com.tencent.smtt.sdk.videoactivity"
 android:configchanges="orientation|screensize|keyboardhidden"
 android:exported="false"
 android:launchmode="singletask"
 android:alwaysretaintaskstate="true">
 <intent-filter>
 <action android:name="com.tencent.smtt.tbs.video.play" />
 <category android:name="android.intent.category.default" />
 </intent-filter>
</activity>

第二步,调用播放视频的调用接口,通过tbsvideo的静态方法,如下:

//判断当前tbs播放器是否已经可以使用。
public static boolean canusetbsplayer(context context)
//直接调用播放接口,传入视频流的url
public static void openvideo(context context, string videourl)
//extradata对象是根据定制需要传入约定的信息,没有需要可以传如null
public static void openvideo(context context, string videourl, bundle extradata)

5. 文件选择器

官方demo中有。简单说一下流程

webchromeclient里面有回调openfilechooser、onshowfilechooser方法。

点击了网页的控件就可以回调上面的方法

在回调方法里面我们利用intent打开文件选择器

然后选择完文件后在onactivityresult回调里面进行获取,然后利用valuecallback<uri>或者valuecallback<uri[]>的onreceivevalue进行返回路径给网页。

注意的地方

1. cookie的调整

com.tencent.smtt.sdk.cookiemanagercom.tencent.smtt.sdk.cookiesyncmanager的相关接口的调用,在接入sdk后,需要放到创建x5的webview之后(也就是x5内核加载完成)进行;否则,cookie的相关操作只能影响系统内核。

2. webview宽高的获取

由于sdk webview所提供的webview类,是对系统webview的聚合包装,所以:获取系统内核的webview或者 x5内核的webview的宽高需要这样:

webview.getview().getwidth();

3. x5内核

开始说了,这个腾讯的webview使用的是自己的x5内核。

如果你的手机有安装qq、微信、qq浏览器等等qq的产品, 这个内核就已经是已经安装到手机上了。

如果都没有,在application初始化调用initx5environment方法的时候,会进行离线安装,失败就会自动切换自用自带内核。

如果都都没有,而且手机没有链接网络,需要离线,这时候需要打包内核进app,app包增大20m左右.

那怎么判断他是使用x5内核还是自带内核呢?
显示网页文字时,可通过长按选择文字的标识判断,如下水滴状选择效果是x5webview的标志:

4. 64位手机的兼容

x5内核暂时不提供64位的so文件,在64位手机上需要让ap以32位模式运行。具体操作如下:

如果使用是eclipse

需要将所有的.so文件都放置在so加载目录:lib/armeabi文件夹下(没有该目录则新建一个,ap中没有使用到.so文件则需要拷贝任意一个32位的so文件到该目录下,如果没有合适的so可以到官网下载官网“sdk接入示例“,拷贝对应目录下的liblbs.so文件),lib文件夹下不要有其他以”armeabi“开头的文件夹。

如果使用的是android studio:

1、打开对应module中的build.gradle文件,在文件的android{}中的defaultconfig{}里(如果没有defaultconfig{}则手动添加),添加如下配置:

ndk{ 
 abifilters "armeabi", "armeabi-v7a", "x86", "mips"
}

如果配置后编译报错,那么需要在gradle.properties文件中加上android.usedeprecatedndk=true;

2、打开,下载sdk接入示例,拷贝对应目录下的liblbs.so文件,到你的armeabi目录下

5. 混淆

jar包本来就已经是混淆好的了,如果你打包时候没有添加规则再混淆一遍的话,就会无法使用x5内核了。所以需要添加混淆规则:

下载混淆文件:

解压后用文本编辑器打开,复制里面的内容到你项目的proguard-rules.pro混淆文件即可。

简单包装

如果在项目中使用,一般来说最好是封装多一层。

  • 防止和原生的webview搞混
  • 有什么问题,一改全改。
  • 可以添加一些功能,例如进度条等。

这里给一个简单加进度条的封装,在项目中使用的话,你在布局文件里面使用路径+progresswebview即可

public class progresswebview extends webview {
 private progressbar progressbar; //进度条
 private int progressheight = 10; //进度条的高度,默认10px
 public progresswebview(context context) {
 super(context);
 initview(context);
 }
 public progresswebview(context context, attributeset attributeset) {
 super(context, attributeset);
 initview(context);
 }
 private void initview(context context) {
 //开启js脚本支持
 getsettings().setjavascriptenabled(true);
 //创建进度条
 progressbar = new progressbar(context, null,
 android.r.attr.progressbarstylehorizontal);
 //设置加载进度条的高度
 progressbar.setlayoutparams(new absolutelayout.layoutparams(framelayout.layoutparams.match_parent, progressheight, 0, 0));
 drawable drawable = context.getresources().getdrawable(r.drawable.progress_bar_states);
 progressbar.setprogressdrawable(drawable);
 //添加进度到webview
 addview(progressbar);
 //适配手机大小
 getsettings().setusewideviewport(true);
 getsettings().setlayoutalgorithm(websettings.layoutalgorithm.narrow_columns);
 getsettings().setloadwithoverviewmode(true);
 getsettings().setsupportzoom(true);
 getsettings().setbuiltinzoomcontrols(true);
 getsettings().setdisplayzoomcontrols(false);
 setwebchromeclient(new wvchromeclient());
 setwebviewclient(new wvclient());
 }
 //进度显示
 private class wvchromeclient extends webchromeclient {
 @override
 public void onprogresschanged(webview view, int newprogress) {
 if (newprogress == 100) {
 progressbar.setvisibility(gone);
 } else {
 if (progressbar.getvisibility() == gone)
  progressbar.setvisibility(visible);
 progressbar.setprogress(newprogress);
 }
 if (mlistener != null) {
 mlistener.onprogresschange(view, newprogress);
 }
 super.onprogresschanged(view, newprogress);
 }
 }
 private class wvclient extends webviewclient {
 @override
 public boolean shouldoverrideurlloading(webview view, string url) {
 //在当前activity打开
 view.loadurl(url);
 return true;
 }
 @override
 public void onreceivedsslerror(webview view, sslerrorhandler handler, sslerror error) {
 //https忽略证书问题
 handler.proceed();
 }
 @override
 public void onpagefinished(webview view, string url) {
 progressbar.setvisibility(gone);
 if (mlistener != null) {
 mlistener.onpagefinish(view);
 }
 super.onpagefinished(view, url);
 }
 }
 private onwebviewlistener mlistener;
 public void setonwebviewlistener(onwebviewlistener listener) {
 this.mlistener = listener;
 }
 //进度回调接口
 public interface onwebviewlistener {
 void onprogresschange(webview view, int newprogress);
 void onpagefinish(webview view);
 }
}


总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对移动技术网的支持。如果你想了解更多相关内容请查看下面相关链接

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网