Android集成三方瀏覽器之X5內核

時間 2019-11-17

原文原文鏈接

不少應用開始採用 hybrid 開發模式，最近在作有關 webrtc 視頻通信的項目，也是使用 hybrid 開發。然而因爲系統 WebView 的兼容性問題（Android 4.4 之前 webview 是基於 webkit ，4.4 及之後採用 chromium）。須要使用一款兼容性較好的內核「完美支持 webrtc」。

現在能夠集成的瀏覽器內核主要有騰訊X5服務英特爾的CrossWalk 火狐Firefox_Focus Chromiumhtml

這一篇主要講解騰訊 X5 瀏覽器的集成，不得不說官方文檔描述的東西太少，若是遇到問題能夠去 X5論壇搜索相關問題。java

騰訊 X5 內核也是基於 chromium 的，相比原生的 WebView 而言，優化了用戶的瀏覽體驗。SDK 是經過共享使用用戶手機上微信、手機QQ、QQ空間等軟件已經下載好的 X5 內核。SDK 很小，且集成簡單隻需幾行代碼便可。android

集成

先去官網下載 SDK 後將所需的 aar 和 so 文件導入咱們的工程。git

x5內核暫時不提供64位的so文件,so可只保留"armeabi"文件夾，手機運行時會向下兼容。github

導入SDK

在 module 的 build.gradle 中添加web

//sdk中只提供了armeabi的文件夾和對應so文件 
 ndk {
            abiFilters "armeabi", "armeabi-v7a", "x86", "mips" 
        }
複製代碼

//添加aar文件
repositories {
    flatDir {
        dirs 'libs'
    }
}

dependencies {
      compile(name: '你的aar文件', ext: 'aar')
}
複製代碼

<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" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
複製代碼

初始化X5服務

//在application中初始化
@Override
    public void onCreate() {
        super.onCreate();
        
        //蒐集本地tbs內核信息並上報服務器，服務器返回結果決定使用哪一個內核。
        QbSdk.PreInitCallback callback = new QbSdk.PreInitCallback() {
            @Override
            public void onViewInitFinished(boolean arg) {
                //x5內核初始化完成的回調，
                // true表示x5內核加載成功，
                // false表示x5內核加載失敗，會自動切換到系統內核。
            }

            @Override
            public void onCoreInitFinished() {
            }
        };

        QbSdk.initX5Environment(getApplicationContext(), callback);
    }

複製代碼

在佈局中添加 WebView

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">

    <ProgressBar android:id="@+id/progressbar" style="?android:attr/progressBarStyleHorizontal" android:layout_width="match_parent" android:layout_height="3dp" />

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

</LinearLayout>
複製代碼

初始化 Webview

public class MainActivity extends AppCompatActivity {
    private ProgressBar progressBar;
    private WebView webView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        progressBar = findViewById(R.id.progressbar);
        webView = findViewById(R.id.webview);
        initWebView();
    }

    private void initWebView() {
        WebSettings settings = webView.getSettings();           //和系統webview同樣
        settings.setJavaScriptEnabled(true);                    //支持Javascript 與js交互
        settings.setJavaScriptCanOpenWindowsAutomatically(true);//支持經過JS打開新窗口
        settings.setAllowFileAccess(true);                      //設置能夠訪問文件
        settings.setSupportZoom(true);                          //支持縮放
        settings.setBuiltInZoomControls(true);                  //設置內置的縮放控件
        settings.setUseWideViewPort(true);                      //自適應屏幕
        settings.setSupportMultipleWindows(true);               //多窗口
        settings.setDefaultTextEncodingName("utf-8");            //設置編碼格式
        settings.setAppCacheEnabled(true);
        settings.setDomStorageEnabled(true);
        settings.setAppCacheMaxSize(Long.MAX_VALUE);
        settings.setCacheMode(WebSettings.LOAD_NO_CACHE);       //緩存模式
        webView.setWebViewClient(new WebViewClient() {          

            @Override
            public void onPageStarted(WebView webView, String s, Bitmap bitmap) {
                super.onPageStarted(webView, s, bitmap);
            }

            @Override
            public void onPageFinished(WebView webView, String s) {
                super.onPageFinished(webView, s);
            }

            @Override
            public boolean shouldOverrideUrlLoading(WebView webView, String url) {
                webView.loadUrl(url);
                return true;
            }

            @Override
            public void onReceivedSslError(WebView webView, SslErrorHandler sslErrorHandler, SslError sslError) {
// super.onReceivedSslError(webView, sslErrorHandler, sslError);
                sslErrorHandler.proceed();//忽略SSL證書錯誤
            }
        });

        webView.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsAlert(WebView webView, String s, String s1, JsResult jsResult) {
                return super.onJsAlert(webView, s, s1, jsResult);
            }

            @Override
            public void onReceivedTitle(WebView webView, String s) {
                super.onReceivedTitle(webView, s);
            }

            @Override
            public void onProgressChanged(WebView webView, int progress) {
                super.onProgressChanged(webView, progress);
               		if（...）{
               			...
                        progressBar.setProgress(progress); //設置進度條
                         ...
                    } else {
                   		 ...
                    }
                }
            }
        });
        webView.loadUrl("http://www.baidu.com");
// webView.reload(); 刷新頁面
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && webView != null && webView.canGoBack()) {
            webView.goBack();
            return true;
        } else {
            ...
        }
    }
}
複製代碼