videojs-vr: Player won't load media on Android Chrome

Hi,

I’m trying to use videojs-vr and it works properly on iOS using Safari or any app with a WebView. But on Android it doesn’t work on Chrome. Samsung browser works fine on a Galaxy S8.

Do I need to do some extra config aside from the default on examples?

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>videojs-vr Demo</title>
   <link href="css/video-js.css" rel="stylesheet">
   <link href="css/videojs-vr.css" rel="stylesheet">
</head>
<body>
  <video id="videojs-vr-player" class="video-js vjs-16-9 vjs-default-skin" controls>
    <source src="vrvideo.mp4" type="video/mp4">
  </video>
  <script src="js/video.js"></script>
  <script src="js/videojs-vr.js"></script>
  <script>
    (function(window, videojs) {
      var player = window.player = videojs('videojs-vr-player');
      player.mediainfo = player.mediainfo || {};
      player.mediainfo.projection = '360';
      // AUTO is the default and looks at mediainfo
      var vr = window.vr = player.vr({projection: 'AUTO', debug: true, forceCardboard: false});
    }(window, window.videojs));
  </script>
</body>
</html>

About this issue

Original URL
State: open
Created 6 years ago
Reactions: 3
Comments: 26 (7 by maintainers)

Most upvoted comments

we are facing the same issue with the current chrome version 76.0.3809.132. serving a mp4 does not work - converting the mp4 to m3u8 works fine using ffmpeg:

ffmpeg -i MAH00878.MP4 -g 60 -hls_time 2 -hls_list_size 0 -hls_list_size 500000 -b:v 15M -b:a 96K MAH00878.m3u8

unfortunately serving the content as mp4 would be the way to go as we wouldn’t need to post-process the video. any solution for this?

we don’t think it’s an cors issue because as I wrote we can access the m3u8 from the server with the same cors settings

bloigge on Sep 10, 2019

This issue is still present on samsung 8 + chrome 70.0.3538.110. I’m using video.js 7.3.0 + videojs-vr.

I get the message :

Your browser/device does not support HLS 360 video. See http://webvr.info for assistance.

joelBrun on Dec 5, 2018

Getting the same result. Pixel 4, Chrome. Screen Shot 2020-07-17 at 1 03 12 PM Screen Shot 2020-07-17 at 2 14 28 PM

tmadison-gpsw on Jul 17, 2020

您使用的是https://github.com/videojs/http-streaming还是https://github.com/videojs/videojs-contrib-hls？

I have the same problem. Android chrome error：your browser/device not support HLS 360 video. See http://webvr.info for assistance. I use version 1.7 videojs-vr，Chrome version 78 and 74.The video format is .M3u8. My code is as follows：

To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video

</video-js> </div> <script src="js/video.js"></script> <script src="js/videojs-vr.js"></script> <script> function _videoReady(_url, titleBar) { window.player = videojs("my-video", { autoplay: false, controls: true, width: '100%', preload: "auto", poster: "images/m.jpg", aspectRatio: "16:9", crossOrigin: "anonymous", html5: { hls: { withCredentials: true } } }, function onPlayerReady() { this.addChild('TitleBar', { text: titleBar }); this.src(_url || ""); this.load(); }); } window.vr = player.vr({ projection: 'AUTO', motionControls: false, debug: true, forceCardboard: false }); </script>

I look forward to your reply and wish you a happy job

xinyueyijiu on Nov 11, 2019

Very strange Works on Samsung s6 and s7 with native browser. I have an iOS, iPad and Mac Safari, woks to.

FernandoJBCosta on Aug 7, 2018

I am still getting this issue when trying to test with a mp4 served from s3. Works on desktop not on Pixel 2 XL was using HLS before but was getting HLS 360 is not supported on device/browser (latest chrome and android P beta). Has anyone run into issues like that?

AndrewStobie on Aug 2, 2018

I’ve exported our video with same res and framerate as the eagle video, and it now works properly!

Only issue is that I can’t toggle fullscreen on webview app. But that’s probably something on our app. This can be closed now.

ghost on Jun 28, 2018