Android元件(WebView) — webView延伸，開啟FaceBook直播

前言：

之前發生一個問題，如果直接用WebView開啟Facebook的直播會出現一片空白的問題。

 因為要看直播一定要開啟facebook的頁面，他會要求你們開啟FB原生的app看直播

但點擊「開啟facebook」後連過去會是一片空白。
稍微檢查一下點連擊的url就會發現問題所在了。

他吐給你的url是一串意義不明的東西。

intent://video/?id=%7B25668421....

大致上長上面那樣

這時候我查了一下開啟fb的方式

發現他們開啟fb的暗碼都是 fb://xxxx

在shouldOverrideUrlLoading撈到url後，直接把url內的intent改成fb就可以順利開啟直播囉！

---

重點程式碼：

下面例子的facebook直播網址請去臉書上面隨機找一個直播連結。

 WebViewClient mWebViewClient = new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            Log.d(TAG, "checkpoint  = " + url);

            if (url.contains("com.facebook.katana")) {
                try {
                    //確認是否有安裝facebook，假如這串錯誤 直接跳到catch
                    activity.getPackageManager().getPackageInfo("com.facebook.katana", 0);
                    //如果有抓取到url 把吐出來的intent改成fb
                    String facebookUrl = url.replace("intent", "fb");
                    //在外部開啟連結
                    startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(facebookUrl)));
                    //在Log確認開啟連結的網址
                    Log.d("MainActivity", "facebookUrl = " + facebookUrl);
                } catch (PackageManager.NameNotFoundException e) {
                    Toast.makeText(activity, "你沒安裝facebook喔，請先安裝！", Toast.LENGTH_SHORT).show();
                }
                finish();
            } else {
                view.loadUrl(url);
            }

            return true;
        }

        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);
        }

        @Override
        public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
            super.onReceivedError(view, request, error);
            Log.d(TAG, "error onReceivedError = " + request);
            view.setVisibility(View.GONE);
        }
    };
 

重點都在這了，下面就直接上完整程式碼。

---

完整程式碼：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.hello.kaiser.webview.MainActivity">

    <WebView
        android:id="@+id/webview_show"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</android.support.constraint.ConstraintLayout>

 

MainActivity.java
下面的直播連結請去fb隨機找一個直播來取代

public class MainActivity extends AppCompatActivity {

    private static final String TAG = MainActivity.class.getSimpleName();

    private WebView mWebView;
    private Activity activity;
    public static String FACEBOOK_URL = "https://www.facebook.com/hua.yingxin.9/videos/256684214854665/?hc_ref=ARTnenvMQbNXRjjvZag73twoaqxWfAd3a8D-U11DAVIaopXBFDEcHXMoGsG4KYL7BCQ&fref=gs&dti=1461364913895987&hc_location=group";


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        activity = this;

        mWebView = (WebView) findViewById(R.id.webview_show);
        WebSettings websettings = mWebView.getSettings();
        websettings.setSupportZoom(true);
        websettings.setJavaScriptEnabled(true);
        websettings.setAppCacheEnabled(true);
        websettings.setSaveFormData(true);
        websettings.setAllowFileAccess(true);
        websettings.setDomStorageEnabled(true);
        websettings.setBuiltInZoomControls(true);
        websettings.setDisplayZoomControls(false);
//        String ua = mWebView.getSettings().getUserAgentString();
//        mWebView.getSettings().setUserAgentString("WebView");

        websettings.setLayoutAlgorithm(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT ? WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING
                : WebSettings.LayoutAlgorithm.NARROW_COLUMNS);
        websettings.setLoadWithOverviewMode(true);
        websettings.setUseWideViewPort(true);

        if (Build.VERSION.SDK_INT > Build.VERSION_CODES.KITKAT) {
            websettings.setCacheMode(WebSettings.LOAD_NO_CACHE);
        }

        mWebView.setWebViewClient(mWebViewClient);
//        mWebView.setWebViewClient(new WebViewClient());
        mWebView.setWebChromeClient(new WebChromeClient());

        mWebView.loadUrl(FACEBOOK_URL);

    }

    WebViewClient mWebViewClient = new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            Log.d(TAG, "checkpoint  = " + url);

            if (url.contains("com.facebook.katana")) {
                try {
                    //確認是否有安裝facebook，假如這串錯誤 直接跳到catch
                    activity.getPackageManager().getPackageInfo("com.facebook.katana", 0);
                    //如果有抓取到url 把吐出來的intent改成fb
                    String facebookUrl = url.replace("intent", "fb");
                    //在外部開啟連結
                    startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(facebookUrl)));
                    //在Log確認開啟連結的網址
                    Log.d("MainActivity", "facebookUrl = " + facebookUrl);
                } catch (PackageManager.NameNotFoundException e) {
                    Toast.makeText(activity, "你沒安裝facebook喔，請先安裝！", Toast.LENGTH_SHORT).show();
                }
                finish();
            } else {
                view.loadUrl(url);
            }

            return true;
        }

        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);
        }

        @Override
        public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
            super.onReceivedError(view, request, error);
            Log.d(TAG, "error onReceivedError = " + request);
            view.setVisibility(View.GONE);
        }
    };
}
 

---

DEMO:

https://github.com/nikeru8/webviewConvertToFb