iFrame in Virtual Reality

Hi veryone,

I am developing my final university degree activity. I am trying to insert a web into a texture or on the program, using an iframe or something similar. (I am developing this for a Virtual Reality application)

I have spent around a month trying to do this and i have not been even close, things that work usually do not seem to work on VR.

Is it even possible to do so?
Has someone achieved it? If so, can you help me please

Thank you all :slight_smile:

It’s not possible to use an iframe in VR as WebXR VR doesn’t show any HTML DOM elements. I’ve seen people render a webpage to a canvas and therefore a texture but I’m not sure how they’ve done it

Here’s the thread: [SOLVED] Multi-threaded operations in WebXR; Editor vs Published

I tried that, the performance was horrible.

There are libraries that transform the DOM elements into SVG, and then you can make the texture.

If it’s something you want to do once, is ok, but don’t expect realtime rendering nor interactivity.

EDIT: html-to-image

EDIT2: The project provided by yaustar looks like is using the same library, but with a much better performance. I’ll have to take a look another day.

2 Likes

Ok thanks

And there is not any way possible of interacting with a webpage in realtime inside the VR application? (without iframe)

If they are simple enough, they should run smoothly enough with the solution yaustar shared.

1 Like

You cannot currently interact with a webpage while in a WebXR (with the possible exception of using some pretty janky hacks). This is for security reasons. There are native VR apps that have supported built-in web browsers. I am not sure what exactly they did to implement the browser.

There is a draft proposal to add DOM overlays to WebXR. This seems to be geared mostly toward phone-based XR experiences. If you read the documentation for the draft proposal, it explicitly states:

It is not intended to provide in-world UI, such as a sign on the facade of a building.

For more info on the DOM overlays draft proposal: GitHub - immersive-web/dom-overlays: A feature incubation repo for layering DOM content on/in WebXR content. Feature lead: Piotr Bialecki

For more general info on the WebXR specification check out: GitHub - immersive-web/webxr: Repository for the WebXR Device API Specification.