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

2022年11月17日20:45:09更新文章

腾讯TBS浏览器服务

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

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

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

1. 技术优势:

其中，X5内核相对于系统webview，具有下述明显优势：

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

其中，X5云端服务包括云加速、云安全、云转换三大功能。云加速是通过首屏加速、智能路由、图片压缩等技术保障网页浏览的快、省、悦；云安全是通过代理加密、URL安全检测、JS黑名单管理、负载监控等防范网页被劫持插入广告、保障网页浏览的安全稳定；云转换是使用URL聚合+XPATH的解决方案，解决移动阅读难题

2. 运行环境

• Android版本： Android 4.0-Android 12.0
• CPU架构：armeabi、armeabi-v7a、arm64-v8a

3. SDK尺寸指标

大小：566K
版本：44226
更新日期：2022-9-5
下载地址： https://x5.tencent.com/tbs/sdk.html

4. 原生和X5 WebView的类对应表

在APP中集成

1. 导Jar包（推荐）

方式1：手动导包
去这个网址： https://x5.tencent.com/tbs/sdk.html ，看到Android SDK 这个就是包，下载回来是一个zip压缩包，解压后把里面的jar文件放到你项目的lib文件夹，右键add as library即可。

2. 自动导包

自动导入和使用方法参考官网，介绍得更加详细：https://x5.tencent.com/docs/access.html

高级一点的使用

参考官网：https://x5.tencent.com/docs/webview.html

注意的地方

1. cookie的调整

com.tencent.smtt.sdk.CookieManager和com.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内核在哪里下载？ 联系这货: http://bbs.mb.qq.com/user/196302

那怎么判断他是使用X5内核还是自带内核呢？
参考官网：https://x5.tencent.com/docs/questions.html ，常见问题第二条。

4. 64位手机的兼容

最新版x5已经支持64位。

简单封装

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

• 防止和原生的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);
    }

}