You are not logged in.

1

Monday, July 24th 2017, 10:18am

iOS black screen - ERROR video loading failed!

The problem is, when I try to open it from an iOS device (tested both iOS 8 and 10), it shows a black screen and get this error:

ERROR: http://lab.pre.rtve.es/escena-360/almagr…grafismo_3K.mp4 - loading video failed!


I know that it is an HTML5/http problem. I created .htacces on the destination (which is the same server and domain):

Source code

1
Header add Access-Control-Allow-Origin "*"Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"



And even used a Node.js middleware (it is a node application) so I set the headers again just in case...

I get the same result, doesn't matter what I try.

I have my crossdomain.xml file on this server, just in case too:

http://lab.pre.rtve.es/crossdomain.xml

It would be really helpful if I can get some guidance about this, please.. thank you very much.

2

Monday, July 24th 2017, 11:19am

Anyone? I'm sure this is such a common problem...

Here is some more information. JS embedpano function call (being this.context.baseUrl = http://lab.pre.rtve.es):

Source code

1
embedpano({swf: this.context.baseUrl + "/libs/krpano.swf", id:"krpanoSWFObject", xml: this.context.baseUrl + "/libs/video.xml", initvars:{videoUrl: this.context.baseUrl + this.props.src, videoInterfaceUrl:this.context.baseUrl + "/libs/skin/videointerface.xml", videoPlayerSwfUrl:this.context.baseUrl + "/libs/plugins/videoplayer.swf", videoPlayerJsUrl:this.context.baseUrl + "/libs/plugins/videoplayer.js"}, onready: this.setVideoElement, wmode:"transparent", target:"pano", passQueryParameters:true});



And here the XML I'm using to setup the player:

Source code

1
2
3
4
5
6
7
8
<krpano>	<!-- ejemplo en youtube para mobile https://www.youtube.com/watch?v=rG4jSz_2HDY -->	<!-- Calidad del video serĂ¡ 4096x2048-->	<include url="%$videoInterfaceUrl%" />
    <!-- include the videoplayer plugin -->    <plugin name="video"            url.flash="%$videoPlayerSwfUrl%"            url.html5="%$videoPlayerJsUrl%"                        videourl="%$videoUrl%"    					pausedonstart="true"	        loop="false"	        enabled="false"	        zorder="0"	        align="center" ox="0" oy="0"
	        width.no-panovideosupport="100%"	        height.no-panovideosupport="prop"
	        onloaded="videointerface_setup_interface(get(name));"	        onvideoready="videointerface_videoready();"                        />
    <view maxpixelzoom="0" fov="90" fovmin="90" fovmax="90" />
		<!-- the panoramic video image -->		<image devices="panovideosupport">			<sphere url="plugin:video" />		</image>
		<security>		    <crossdomainxml url="http://lab.pre.rtve.es/crossdomain.xml" />		</security>
		<security cors="off">		    <allowdomain domain="*" />		</security>    </krpano>

3

Monday, July 24th 2017, 12:01pm

I forgot to say...


My application, running on node, is setup on a port:

http://lab.pre.rtve.es:3016/

and then I use a proxypass so users can access to:

http://lab.pre.rtve.es/escena-360/almagro-respira-teatro/

and not notice that there is Nodejs behind or any port in between.


Could this be the problem?

4

Monday, July 24th 2017, 12:39pm

SOLVED!!!

It was a problem with video resolution!

I was using a way too big resolution for these devices.. (it seems too big for Apple). I was using 3K, and as soon as I tried with a 2K video, the problem was totally gone.

Thank you anyway!

And thanks to krpano support that helped me to solve this problem really really quick.

PD: this should be in the docs somewhere... I didn't find it during all the reads I did searching for a solution. Could it be missing?


Cheers