Question

我已经开发了一个asp.net的移动页面来播放mp4视频。

我知道iOS已经禁用了自动播放功能以最大限度地减少用户带宽，所以我怎么能这样做在Android上自动播放HTML5 mp4视频？

我已经在HTML5代码中添加了自动播放功能，但它不起作用。

以下是我的代码：

<video autoplay controls id='video1' width='100%' poster='images/top_icon.png' webkitEnterFullscreen poster preload='true'>
<source src='http://192.xxx.xxx.xx/XXXXVM01.mp4' type='video/mp4; codecs='avc1.42E01E, mp4a.40.2' >
</video>

此外，我已经解决了用户点击图片叠加层可以播放视频的问题。谢谢Karthi

这是代码：

<script type="text/javascript">
    $(document).ready(function() {
    $("#video1").bind("click", function() {
    var vid = $(this).get(0);
    if (vid.paused) { vid.play(); }
    else { vid.pause(); }
    }); 
}); 
</script>

由于

乔

Answer 1

您可以添加＆＃39;静音＆＃39;和＆＃39;自动播放＆＃39;属性一起启用Android设备的自动播放。

e.g。

＆＃13;

<video id="video" class="video" autoplay muted >

＆＃13;

Answer 2

我使用了以下代码：

// get the video
var video = document.querySelector('video');
// use the whole window and a *named function*
window.addEventListener('touchstart', function videoStart() {
  video.play();
  console.log('first touch');
  // remove from the window and call the function we are removing
  this.removeEventListener('touchstart', videoStart);
});

似乎不再是一种自动启动方式了。

这使得它们第一次触摸屏幕时视频将播放。它也将在首次运行时自行删除，以便您可以避免多个侦听器相加。

Answer 3

Android实际上有这个API！方法是setMediaPlaybackRequiresUserGesture()。经过大量的视频自动播放和SO的大量尝试攻击后我才发现它。以下是blair vanderhoof的示例：

package com.example.myProject;

import android.os.Bundle;
import org.apache.cordova.*;
import android.webkit.WebSettings;

public class myProject extends CordovaActivity 
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        super.init();
        // Set by <content src="index.html" /> in config.xml
        super.loadUrl(Config.getStartUrl());
        //super.loadUrl("file:///android_asset/www/index.html");

        WebSettings ws = super.appView.getSettings();
        ws.setMediaPlaybackRequiresUserGesture(false);
    }
}

Answer 4

我不认为自动播放适用于Android，但是播放视频可能会非常棘手。我建议您阅读本文：Making HTML5 Video work on Android phones。

Answer 5

重要说明：请注意，如果在Chrome的设置中启用了Google Chrome数据保护程序，则会禁用自动播放。

Answer 6

自动播放仅在第二次工作。在Android 4.1+上你必须有某种用户事件才能让第一个play（）工作。一旦发生这种情况，自动启动就会起作用。

这样用户就可以确认他们正在使用带宽。

还有另一个问题可以解决这个问题。 Autostart html5 video using android 4 browser

Answer 7

在Android 4.4及更高版本中，只要HTML5视频组件位于您自己的WebView中，就可以删除对用户手势的需求

webview.setWebChromeClient(new WebChromeClient());
webview.getSettings().setMediaPlaybackRequiresUserGesture(false);

要让视频自动播放，您仍然需要为视频元素添加自动播放功能：

<video id='video' controls autoplay>
  <source src='http://192.xxx.xxx.xx/XXXXVM01.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' >
</video>

Answer 8

类似于KNaito的答案，以下为我提供了诀窍

function simulateClick() {
  var event = new MouseEvent('click', {
    'view': window,
    'bubbles': true,
    'cancelable': true
  });
  var cb = document.getElementById('player'); 
  var canceled = !cb.dispatchEvent(event);
  if (canceled) {
    // A handler called preventDefault.
    alert("canceled");
  } else {
    // None of the handlers called preventDefault.
    alert("not canceled");
  }
}

Answer 9

在Android 4.1和4.2中，我使用以下代码。

    evt.initMouseEvent( "click", true,true,window,0,0,0,0,0,false,false,false,false,0, true );
    var v = document.getElementById("video");
    v.dispatchEvent(evt);

其中html是

    <video id="video" src="sample.mp4" poster="image.jpg" controls></video>

这很有效。但在Android 4.4中，它不起作用。

Answer 10

这是PhoneGap的一个插件，它为我解决了这个问题： https://build.phonegap.com/plugins/1031

我只是将它包含在我的config.xml

中

Answer 11

<video autoplay controls id='video1' width='100%' poster='images/top_icon.png' webkitEnterFullscreen poster preload='true'>
<source src='http://192.xxx.xxx.xx/XXXXVM01.mp4' type='video/mp4; codecs='avc1.42E01E, mp4a.40.2' >
</video>

Answer 12

我简化了Javascript以触发视频开始。

＆＃13;

 var bg = document.getElementById ("bg"); 
 function playbg() {
   bg.play(); 
 }

＆＃13;

<video id="bg" style="min-width:100%; min-height:100%;"  playsinline autoplay loop muted onload="playbg(); "><source src="Files/snow.mp4" type="video/mp4"></video>
</td></tr>
</table>

＆＃13;

*＆＃34;文件/ snow.mp4＆＃34;只是样本网址

Answer 13

可以添加muted代码。

<video autoplay muted>
  <source src="video.webm" type="video/webm" />
  <source src="video.mp4" type="video/mp4" />
</video>

参考Image link here

Answer 14

不要单独使用“静音”，请使用[muted] =“ true”例如以下代码：

<video id="videoPlayer" [muted]="true" autoplay playsinline loop style="width:100%; height: 100%;">
<source type="video/mp4" src="assets/Video/Home.mp4">
<source type="video/webm" src="assets/Video/Home.webm">
</video>

我在更多的Android和ios中进行测试

Answer 15

Chrome已将其停用。 https://bugs.chromium.org/p/chromium/issues/detail?id=159336 甚至jQuery play（）都被阻止了。他们希望用户启动它，以便节省带宽。

如何在Android上自动播放HTML5 mp4视频？

15 个答案: