Android - Webview tự động play video

Để play video trên webview thì tất nhiên trình duyệt web của thiết bị android của bạn phải hổ trợ HTML5. Trong bài này tôi xin nói về cách play video trên các thiết bị android mà trình duyệt có hổ trợ HTML5. Vì chỉ là newbie nên tôi chỉ viết bài đơn giản và có gì thiếu sót thì mong các bạn hổ trợ để bài viết tốt hơn.
Tôi xin bắt đầu vào nội dung chính.

  Your browser does not support the video tag.

Sau đó tôi dùng webview để load đoạn mã trên.

        wvVideoTest.loadDataWithBaseURL(null, htmlSource, "text/html", "UTF-8", null); 

Mặc dù trong đoạn mã HMTL trên có thuộc tính autoplay nhưng khi build chạy trên thiết bị android nó vẫn không tự động chạy được mặc dù trên web thì rất tuyệt vời. Vậy hướng giải quyết của chúng ta ra sao ?

Rất đơn giản chúng ta sẽ gọi hàm play video bằng javascript và lưu ý là gọi sau khi webview tải trang xong.

        wvVideoTest.loadUrl("javascript:(function() { document.getElementsByTagName('video')[0].play(); })()");

Vì tôi rất... gà javascript nên các bạn cứ đọc vào tham khảo câu lệnh trên nhé ;)

Để chạy được đoạn mã javascript trên thì chúng ta cần phải enable javascript cho webview

        settings.setJavaScriptEnabled(true);
        settings.setJavaScriptCanOpenWindowsAutomatically(true);
        settings.setPluginState(WebSettings.PluginState.ON); 

Full code như sau:

 
        final WebSettings settings = wvVideoTest.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setJavaScriptCanOpenWindowsAutomatically(true);
        settings.setPluginState(WebSettings.PluginState.ON);
        
        wvVideoTest.setWebViewClient(new WebViewClient() {
            public void onPageFinished(WebView view, String url) {
                wvVideoTest.loadUrl("javascript:(function() { document.getElementsByTagName('video')[0].play(); })()");
            }
        });
        
        String htmlSource = "Your browser does not support the video tag.";
        
        wvVideoTest.loadDataWithBaseURL(null, htmlSource, "text/html", "UTF-8", null); 

Nếu bạn muốn hiển thị thanh tiến trình thì thêm thuộc tính controls vào trong đoạn mã HTML trên nhé.
Chúc bạn thành công.