Create an embedded web browser in PlayCanvas

I wanted to create a web browser in 3D world space for a user to interact with (maybe while inside a VR experience) or if that’s not possible then have a world space canvas that could render static webpages(or their screenshots) through a url.

Is this possible in playcanvas ?
maybe by using Chromium Embedded Framework or Puppeteer (Headless Chrome Node.js API) ?

In a nutshell, if you can find a library that runs in the browser, it will ‘work’.

If you need it in a VR experience, you have to find something that renders in a WebGL context.

Someone last year was doing some work in this area that you can find here: [SOLVED] Multi-threaded operations in WebXR; Editor vs Published

1 Like

So full fledged embedded web browser is not possible for VR as the VR view is purely WebGL right @yaustar ?
Because one would have to render the content(html) to a texture and render that in the 3D world so it’ll always be a screenshot of sorts.

See the thread I linked to above. It looks like it is possible via some means but it isn’t something I’ve explored personally.

The project is also using htmlToImage library as a renderer for converting the html into a texture and then updating the texture at every value update received from the custom website, or at least what I’m able to understand.

I’ve already tried this library earlier and it’s not quite the thing I’m looking for since it only works on div/html files but doesn’t work with iframe elements when fetching external website in it at runtime (to implement a kind of embedded browser) due to the CORS issue.

@TechZ I’ve just been shown Hyperbeam — Embed virtual computers in Three.js where you can use a remote browser to render as a video in WebGL which should work in VR.

It uses hyperbeam.com and I’m interested in doing an example of it when I next get a chance as it looks pretty cool!

2 Likes