10

I have developed an application where the user can set videos on a web page: - They can specify a Youtube URL OR - They can upload a video

Depending on which option the user chooses i render a video page like this : If a video is from youtube:

<iframe type="text/html" width="640" height="385" src="http://www.youtube.com/embed/YOUTUBEID?autoplay=1&loop=1&autohide=1&fs=0"  frameborder="0"></iframe>

If the video is being uploaded:

<video id="video" style="cursor: pointer;" width="640" height="480"  autoplay controls loop>
  <source src="../video/Tareas_Diarias_Resumen.mp4" type="video/mp4" />
</video>

OK. All this works perfect on Google Chrome, but the fact is that the video is going to be watched on 16 Samsung GT-P5100 Android 4.03 Tablets.

We created an Android application which embeds an webView like that:

WebView engine = (WebView) findViewById(R.id.web_engine);
engine.setWebChromeClient(new WebChromeClient());
engine.getSettings().setPluginsEnabled(true);
engine.getSettings().setPluginState(PluginState.ON);
engine.getSettings().setJavaScriptEnabled(true);
engine.getSettings().setAllowFileAccess(true);
engine.loadUrl(miUrl);

And here I have two issues: 1- Youtube video. It works ok, I can see the video but with no autoplay, and we want it to work with autoplay. Any solution? 2- The uploaded video does not work, I can see the player but no video.

The video was converted with handbrake, choosing iphone & ipod-touch preset and "Web Optimized" option.

Any help or clue? Thanks in advance

Developer
  • 144
  • 11
Kioko Kiaza
  • 1,378
  • 8
  • 28
  • 57
  • Autoplay on most mobile platforms (Android, iOS) gets blocked to avoid poor user experiences - video should only play following a user action. You can usually work around it by triggering the play() on another event (eg the onloaded event) – Offbeatmammal Apr 11 '13 at 15:15
  • @Offbeatmammal can you write this like an answer to close this question? thanks. I found this also http://www.longtailvideo.com/html5/autoloop/ – Kioko Kiaza May 23 '13 at 13:54
  • done, though looks like there's an accepted answer already – Offbeatmammal May 23 '13 at 15:37

4 Answers4

33

Auto-play is disabled since Android SDK 17, but you can set setMediaPlaybackRequiresUserGesture to false to re-enable auto-play. Don't forget to check the SDK version because there is not such function in earlier versions. 

    int SDK_INT = android.os.Build.VERSION.SDK_INT;
    if (SDK_INT > 16) {
        engine.getSettings().setMediaPlaybackRequiresUserGesture(false);
    }
Conn
  • 373
  • 3
  • 10
10

[upgraded to answer per request]

Autoplay on most mobile platforms (Android, iOS) gets blocked to avoid poor user experiences - video should only play following a user action. You can usually work around it by triggering the play() on another event (eg the onloaded event)

Offbeatmammal
  • 7,970
  • 2
  • 33
  • 52
4

For Android 4.0.x, try triggering the event : loadstart

var vid=document.getElementById('video');
vid.addEventListener("loadstart", showVideo, false);
function showVideo(e) {
  vid.play();
}
Developer
  • 144
  • 11
binhdocco
  • 83
  • 5
  • 3
    I agree. For Android < 4.2.2 it seems that the last DOM event you get is 'loadeddata'. You likely won't get "canplaythrough". To autoplay, you then use javascript `var myvideo = document.getElementsByTagName('video')[0]; myvideo.play();` For Android 4.2.2+ all you need in your native code is `WebView.getSettings().setMediaPlaybackRequiresUserGesture(false);` – Someone Somewhere Jan 16 '14 at 00:15
0

That can not be achieved, autoplay on most mobile platforms (Android, iOS) gets blocked to avoid poor user experiences. Look at this: http://www.longtailvideo.com/html5/autoloop/

ikerib
  • 781
  • 3
  • 11
  • 28