15

我正在为带有单个 3gpp（或 mp4）视频的 Android 4 智能手机设计一个 html5 页面，该视频在打开时必须自动全屏播放；视频结束时应重定向到另一个 url。

一些谷歌搜索告诉我，Android 4 上不再允许自动播放，所以我选择显示海报图像，用户必须点击才能开始播放视频。然后：

  1. 调用全屏模式
  2. 视频应该自动开始（确实是通过用户点击海报图像开始的）
  3. 当视频完成播放 Android 应该退出全屏
  4. 最后将用户重定向到另一个页面。

2 和 3 不起作用：在调用全屏后，用户必须再次“单击”以开始视频，当视频结束时 exitfullscreen 不起作用（屏幕为黑色，用户必须按手机上的“返回”键才能退出手机视频播放器）。

看起来像video.webkitExitFullScreen()并且video.play()在 Android 4 上被忽略。

这是我正在使用的 html5 标记和 javascript 代码，你能帮我指出一个解决方案吗？

谢谢！

    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width; initial-scale=1.0" />
    <meta name="description" content="" />
    <title>test</title>

    <script type="text/javascript">

        function videoEnd() {
            var video = document.getElementById("video");
            video.webkitExitFullScreen();
            document.location = "http://www.google.com";
        }

        function playVideo() {
            var video = document.getElementById("video");
            video.addEventListener('ended', videoEnd, false);
            video.webkitEnterFullScreen();
            video.play();
        }

    </script>
</head>
<body>
    <video id="video" poster="../img/image.jpg" onclick="playVideo();">
        <source src="../video/videoname.3gp" type="video/3gpp" />
    </video>
</body>
4

4 回答 4

1

我知道这是一个旧帖子，但有人可能正在寻找这个。就个人而言，我只是在视频完成后隐藏视频元素（使用简单的 jquery $videoElement.hide()），这会自动让我回到浏览器。

我们已经在多个移动设备（iOS 和 Android）上对此进行了测试。

不过，我还有另一个问题，那就是现在我的浏览器似乎是全屏的（这在我的情况下会导致其他问题）。

于 2014-07-08T14:09:21.503 回答
1

我有一些建议可能对你有帮助

这将适用于 Android Web 视图应用程序而不是 android Web 应用程序。

您可以创建 android 连接或 android Web 视图客户端，将值作为变量（查询字符串）传递并从您拥有所有控制权的 Android 本机播放视频。

请找到播放视频的代码。

enter code here

public void videoPlayer(String path, String fileName, boolean autoplay){
getWindow().setFormat(PixelFormat.TRANSLUCENT);
//the VideoView will hold the video
VideoView videoHolder = new VideoView(this);
//MediaController is the ui control howering above the video (just like in the default youtube player).
videoHolder.setMediaController(new MediaController(this));
//assing a video file to the video holder
videoHolder.setVideoURI(Uri.parse(path+"/"+fileName));
//get focus, before playing the video.
videoHolder.requestFocus();
if(autoplay){
    videoHolder.start();
}

}

如果您想实现一种明亮的海湾，请联系我，我将为 HTML 5 提供帮助

干杯

于 2012-09-17T14:03:53.800 回答
0

似乎在更高版本的 android 中，程序化video.play()需要来自WebView. 例如

settings.setMediaPlaybackRequiresUserGesture(false);

于 2013-09-05T04:29:15.113 回答
0

我最近遇到了类似的问题。经过数小时的网络搜索，这是我的工作方式：

在调用“play()”方法之前，使用“load()”方法。所以在你的代码中：

    function playVideo() {
        var video = document.getElementById("video");
        video.addEventListener('ended', videoEnd, false);
        video.webkitEnterFullScreen();
        video.load();
        video.play();
    }

我已经在 android 2.2、2.3 和 iPhone 3 上测试过，它可以工作。但是它似乎无法在 android 4.0 上播放。

附言

如果您想在视频播放完毕后重定向，请使用此事件：

var video = document.getElementById("video");
video.addEventListener("ended",doSomething,true);

function doSomething() {
     //your redirect code here
}
于 2012-06-19T13:23:45.913 回答