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/alm…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):

    Code
    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.

  • 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):

    Code
    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:

    Code
    <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>
  • 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

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!