Video not working on HTML5 Chrome browser mobile?

#1

Hi All,

I’m using openfl.media.Video to display an mp4 file on HTML5 targets.

It works great on all desktop browsers and even on firefox-mobile.

The only issue is its not working on chrome-mobile(v.41.0.2272.96) and opera-mobile (iOS7.1.2).
on chrome im getting a black rectangle. on iOS -just blank. i connected chrome via remote debugging and the console shows no error.

here is the code im running:

private var _video:Video;
private var _stream:NetStream;
private var _nc:NetConnection;

public function new(address:String)
{
    _nc = new NetConnection();
    _nc.connect(null);
    _stream = new NetStream(_nc);
    _video = new Video();
    addChild(_video);
    
    _stream.addEventListener(NetStatusEvent.NET_STATUS, onVideoLoaded);
    _stream.addEventListener(AsyncErrorEvent.ASYNC_ERROR, asyncErrorHandler);
    _video.attachNetStream(_stream);
    _stream.play(address);
}

private function onVideoLoaded(nsLoaded:NetStatusEvent):Void
{
    if (nsLoaded.info.code == "NetStream.Play.Start"){}
    else if(nsLoaded.info.code == 'NetStream.Play.Stop'){}
    else if(nsLoaded.info.code == 'NetStream.Seek.InvalidTime'){}
}

private function asyncErrorHandler(e:AsyncErrorEvent):Void
{
    trace('asyncErrorHandler', e.text);
}
1 Like
#2

Could it be that it doesn’t like the video format for some reason?

#3

Thanks for the response singmajesty,
but this is porobably not the issue,

  1. I’ve tried it with a few different mp4 files and t doesnt work.
  2. It does work on other browsers - chrome on desktop for example - but does not work on chrome on mobile…

Im still stuck with that, any idea on what could be the issue would help…

#4

I have the same issue right now on Android 5.1. I loaded sources into tags and specifying each format (mp4, webm, ogv). It works on Chrome and Firefox Desktop browsers but only works on Firefox mobile. Doesn’t work on Safari and Chrome mobile.
I connected Chrome via remote debugging and the console shows no error just like your case.
Any solution?

PS: Sorry for my bad English.

#5

Anyone has a solution to this issue?
I’m still experiencing the same problem…

#6

Are you guys using -Ddom?

It’s possible that certain browsers might not support drawing video tags to canvas

2 Likes
#7

@singmajesty - Yes we are, still only firefox on mobile is working…

#8

Oh, interesting. With -Ddom, it should be a standard Video element on the DOM. Maybe it doesn’t like Video + CSS transforms or something

1 Like
#9

Thanks for your comments, I will keep this post updated if anything changes.

#10

What is the status now?
Does openfl.media.Video work now (with/without -Ddom) ?

#11

Currently, I did not manage to get this to work.

#12

Hi all… Last week I had a real strange problem with video display. It displays ok on my samsung S5. However when I tried the same application on an SIII mini ( chrome ), video sound played ok but video didn’t displays ( noisy pixels ), however if I open the video Directly, it displays ok. I decided to keep the app as is and handle the video from Outside using Video Tag. Have to make several walkaorunds but it seems to be working ok.

www.rula.tv/ruleta/demo/

If someone needs some explanation on what I have done in the javscripts outside the app, just let me know, inside the app I made:

		videoURL = 'http://www.' + Constants.SERVER_HOST + sep + '/videos/' + suffix[Std.parseInt(ruletaActiva) - 1] + '_' + Std.string(aNumero) + '.mp4';
		var tu:VideoElement = cast(Browser.document.getElementById('videoDisplay'), VideoElement);	
		tu.src = videoURL;
		tu.play();
		ExternalInterface.call("displayVid", '0');

and I place a listener for enterFrame calling

var tu = ExternalInterface.call(“testEnd”, false);

To throw up the ended event.

I am mostly interested to test it up in several phones, if someone has time to test it and let me know if it works ok or not I would really appreciate.

Thanks in advance
Luis

#13

You should add webm and ogg as well (in the same video tag)

<source src="http://www.rula.tv/ruleta/demo/videos/loop.webm" type="video/webm">
<source src="http://www.rula.tv/ruleta/demo/videos/loop.ogg" type="video/ogg">

Because some browser can’t play mp4.

Your video is not working on chrome browser (Samsung Galaxy Tab3) and your application is not loading on WP8.

Is there a way to set alternative video format with OpenFL ?

#14

You may have to detect the browser and use different paths yourself at the moment