Chặn yêu cầu nguồn video HTML5 trong Android WebView

Question

Tôi có ứng dụng hiển thị trang HTML5 có phần tử video trong WebView. Phải mất một thời gian để tìm ra cách để làm cho video hoạt động, nhưng cuối cùng tôi đã thành công để phát video được nhúng trong một WebView trên một Tab Samsung Galaxy (Android 3.1). Tôi đã sử dụng mã sau cho thẻ video:

<video controls poster="img/poster.jpg" height="240" width="360"> 
     <source src="video/BigBuck.m4v"> 
     <source src="video/BigBuck.theora.ogv" type="video/ogg"> 
     <source src="video/BigBuck.webm" type="video/webm"> 
     HTML5 video not supported. 
</video> 

Phần tử video có nhiều nguồn và giờ tôi đang cố chụp nguồn video đã chọn (và định dạng) trước khi video bắt đầu phát. Khi tôi nhấp vào nút phát, tôi thấy yêu cầu HTTP cho tệp video đến máy chủ web nơi tệp video được lưu trữ nhưng tôi không thành công trong việc chặn yêu cầu này ở phía ứng dụng.

Tôi đã xem xét một số phương pháp để xem liệu yêu cầu cho tệp video có vượt qua ở đó hay không, nhưng tôi không thấy nó chuyển vào bất kỳ tệp nào trong số đó.

• Chỉ trong shouldOverrideUrlLoading(WebView view, String url) trong số WebViewClient chỉ yêu cầu trang HTML5 ban đầu của tôi.
• Trong shouldInterceptRequest (WebView view, String url) trong số WebViewClient Tôi chỉ thấy chuyển yêu cầu trang HTML5 ban đầu và yêu cầu cho hình ảnh áp phích video chứ không phải cho tệp video.
• onShowCustomView(View view, CustomViewCallback callback) trong số WebChromeClient chỉ được gọi khi tôi nhấp vào nút điều khiển toàn màn hình trên trang HTML5 khi video đang phát, nhưng không phải khi tôi nhấp vào nút phát. (Mục đích của phương pháp này thực sự là gì?)

Có ai có đề xuất phương pháp khác để tôi có thể yêu cầu tệp video hoặc bất kỳ ai có thể giải thích cho tôi điều gì thực sự xảy ra khi tôi nhấp vào nút phát phần tử video?

Answer 1

Tôi đã giải quyết vấn đề bằng cách sử dụng phương pháp javascript. Khi trang HTML được tải, sự kiện loadedmetadata được kích hoạt khi siêu dữ liệu video đã được tải. Từ thời điểm đó, bạn có thể lấy nguồn video đã chọn từ thuộc tính currentSrc của phần tử video và chuyển nó qua một mã số JavascriptInterface tới mã gốc của Android.

Dưới đây là mã của phần tử video HTML5. "Android" là tên mà theo đó JavascriptInterface có thể được truy cập bằng javascript.

<video poster="image/poster.jpg" height="240" width="360" onloadedmetadata="Android.interceptPlay(this.currentSrc);"> 
    <source src="video/BigBuck.m4v"> 
    <source src="video/BigBuck.webm" type="video/webm"> 
    <source src="video/BigBuck.theora.ogv" type="video/ogg"> 
    HTML5 video not supported. 
</video> 

Mã của JavascriptInterface

private class JavaScriptInterface { 
    Context mContext; 

    /* Instantiate the interface and set the context */ 
    JavaScriptInterface(Context c) { 
     mContext = c; 
    } 

    public void interceptPlay(String source) { 
     // do something 
    } 
} 

Và cuối cùng thêm JavascriptInterface đến WebView lúc tạo Hoạt động

mWebView.addJavascriptInterface(new JavaScriptInterface(this), "Android"); 

Điều quan trọng là nắm bắt những sự kiện loadedmetadata bằng cách thêm thuộc tính onloadedmetadata cho phần tử video HTML5 chứ không phải bằng cách đăng ký trình xử lý sự kiện khi tải trang qua addEventListener("loadedmetadata",...) vì trên mạng nhanh, sự kiện loadedmetadata có thể được kích hoạt trước khi người nghe được đăng ký (xem http://dev.opera.com/articles/view/consistent-event-firing-with-html5-video)