在android中调用javascript通过流媒体复制视频_Javascript_Android_Video_Webview

在android中调用javascript通过流媒体复制视频

javascript android video webview

在android中调用javascript通过流媒体复制视频,javascript,android,video,webview,Javascript,Android,Video,Webview,我正在尝试在我的android应用程序中通过流媒体复制视频，我的应用程序中有下一个html文件： <!doctype html> <html> <head> <script type="text/javascript"> var vid; function init() { vid = document.getElementById("myVid

我正在尝试在我的android应用程序中通过流媒体复制视频，我的应用程序中有下一个html文件：

<!doctype html>
<html>
    <head>
        <script type="text/javascript">
            var vid;
            function init() {
                vid = document.getElementById("myVideo");
            }
            function loadVideoSource(videoSource) {
                vid.setAttribute("src", videoSource);
                vid.load();
                vid.play();
            }
            function stopVideoSource(){
                vid.pause();
            }
            function resizeBig(screenWidth, screenHeight){
                vid.style.width =screenWidth;
                vid.style.height =screenHeight;
            }
            function resizeSmall(){
                vid.style.width ='320px';
                vid.style.height ='180px';
            }
            </script>
    </head>
    <body onload="init()">
        <video src="" id="myVideo" optimized_for_streaming="true" autoplay="autoplay" x-webkit-airplay="allow" controls="controls" webkit-playsinline preload="metadata" height="180" width="320">
        </video>
    </body>
</html>

这是布局图：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
 tools:context=".MainActivity" >

    <FrameLayout
        android:id="@+id/fullscreen_custom_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#FF000000"/>

    <LinearLayout 
        android:id="@+id/linearlayout"
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent"> 

        <WebView
             android:id="@+id/webView"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent" />

    </LinearLayout>
</RelativeLayout>

当我开始此活动时，屏幕上会出现白色的视频屏幕，带有播放/暂停前进等控制器，但视频永远不会再现。我还需要什么来复制视频？我做错了什么？

也许你应该在

onPageFinished（）中执行JS

：

不在下列时间之后：

mWebView.loadUrl("file:///android_asset/video_player.html");

最好在

loadUrl（）之前调用setWebViewClient（）

------编辑01/04---------
更多提示：
如果您不想全屏播放，那么您根本不需要调用webviewcromeclient.onShowCustomView（）
。您的HTML页面与我发布的上述代码片段配合得很好。但也请确保您的视频编解码器受android webkit支持。我用它作为样本
如果你真的想全屏播放，你可以看看这个或。希望他们能帮忙
------编辑02/04---------
另外，不要忘记这样做：
在清单中添加android:hardwareAccelerated
。看
权限android.Permission.INTERNET
也需要在您的清单中
试过了，但仍然不起作用。我已经尝试了几个URL，但是仍然有一个withe REDUCTORI，我没有使用showcustomview

方法，但是也不起作用。我也试过你用的视频。阅读其他一些帖子时，我意识到他们有时使用媒体播放器，但我没有使用任何媒体播放器，有必要吗？请注意，这是我用来播放视频的全部代码。您的清单中是否有

android:hardwareAccelerated

？我已经找出了问题所在。这是我使用的互联网连接。维护的代码与您的答案一致。非常感谢你的帮助。

private class HelloWebViewClient extends WebViewClient  {
    @Override
    public boolean onPageFinished(WebView webview, String url) {
        webView.loadUrl("javascript:loadVideoSource('videoUrl')");
    }
}

mWebView.loadUrl("file:///android_asset/video_player.html");