Need help getting 3D video playing on web player on Meta Quest 2 browser

Support
1

I think I’m missing something.

When I view the VR video on my laptop, it looks find. When I view it on my Meta Quest 2, it doesn’t start in VR mode, and nothing I do on the headset can get it into a proper VR mode; it’s just distorted. The best I can get also requires me to hit play, hit full screen, then select 180 under the VR menu.

I’ve tried doing some research on this. I’ve also tried looking for comprehensive docs (such as documentation on all configuration options), but I’ve struck out. I’m hoping someone here can help me out.

My steps, in brief:

  • I’m starting with this video.
  • I’ve used the VOD encoder on the file using the defaults.
  • The page with the embedded player can be found here.

Here’s the javascript that configures and starts the player:

var conf = {
  key: '8bbb9fa5-d825-443d-97cc-34a4a33ce596',
  analytics: {
    key: 'acf564b1-bc8b-42d6-a93e-663e069cf0ea',
    title: 'Test Video',
    videoId: 'wizard-Test_Video-1707477764772',
  },
};

var source = {
  title: "Video",
  dash: 'https://dt-docman-bitmovin-output.s3.amazonaws.com/R0010049_2/manifest.mpd',
  hls: 'https://dt-docman-bitmovin-output.s3.amazonaws.com/R0010049_2/manifest.m3u8',
  vr: {
    startPosition: 0,
    contentType: 'single',
    initialRotation: 'true',
    initialRotateRate: 0.07
  }
};

var player = new bitmovin.player.Player(document.getElementById('player'), conf);
player.load(source);
2

Hey there!

Your setup and config is correct - the reason playback is not working as expected on the Quest 2 is that the web player does not implement the WebXR API. This is the API that needs to be implemented in order to properly display content in a virtual environment on VR headsets.

We have evaluated implementing WebXR support in a hackathon in the past, and we’ve got a demo lying around that works on the Quest 3. It’s also possible to implement proper WebXR support on top of our player.

Let me see if I can either share our demo or provide you with a code sample that shows how to use the WebXR API with our player.