Hey everyone, I’m stuck trying to get a 3D globe library working in a headless browser setup. I’ve been using Firefox with Xvfb as a virtual framebuffer. I also gave SlimerJS a shot.
Here’s the error I keep running into:
Script Error: uncaught exception: RuntimeError: The browser supports WebGL, but initialization failed.
RuntimeError@http://example.com/Globe3D/Globe3D.js:11697:19
Context@http://example.com/Globe3D/Globe3D.js:97405:1
Scene@http://example.com/Globe3D/Globe3D.js:122319:23
GlobeWidget@http://example.com/Globe3D/Globe3D.js:132474:25
@http://example.com/:254:22
I’ve searched online but haven’t found a solid solution. There was an old thread about WebGL unit tests in headless browsers, but it didn’t have much useful info.
Has anyone managed to get 3D globe libraries or similar WebGL stuff working in a headless environment? Any tips or workarounds would be super helpful. Thanks!
hey josephk, i fixed a similar issu by upping xvfb’s display resolutn and using xvfb-run with -a option. also, check your gl drivers. sometimes, a lite library works better headless. cheers.
I’ve dealt with similar headaches trying to run WebGL stuff headless. What finally worked for me was switching to a Node.js-based solution using node-canvas and node-gl. It’s a bit of a pain to set up initially, but it bypasses a lot of the browser-specific issues.
For your specific case, you might want to look into using node-globe. It’s designed for server-side 3D globe rendering and doesn’t rely on browser WebGL. You’ll need to install some system dependencies (Cairo, etc.), but once it’s up and running, it’s pretty smooth.
If you absolutely need to stick with a browser environment, have you tried increasing the shared memory size for Xvfb? Sometimes WebGL init fails due to memory constraints. Try running Xvfb with something like:
Xvfb :99 -ac -screen 0 1280x1024x24 -nolisten tcp
Then set your DISPLAY variable accordingly before launching Firefox. It’s not a guaranteed fix, but it’s helped me in the past when dealing with finicky WebGL setups.
I’ve encountered similar issues when working with WebGL in headless environments. One approach that worked for me was using Puppeteer with Chrome instead of Firefox. Puppeteer has better support for WebGL in headless mode.
If you need to stick with Firefox, you might try enabling the WebGL software renderer. Add these preferences to your Firefox profile:
webgl.disable-hardware-compositing = true
webgl.force-enabled = true
gfx.canvas.azure.backends = skia
layers.acceleration.force-enabled = true
Keep in mind that software rendering will be slower, but it could get you past the WebGL initialization error. Another option is to use a cloud GPU service like AWS G4 instances, which provide GPU acceleration for headless environments.
Hope this helps point you in the right direction!