How to render a scene and take a screen shot using Babylon running inside a docker/express container?

I have a express server running inside a docker container. Once a user makes a REST call to an endpoint, it should render a scene using Babylon.js, make a screenshot and then create a PDF out of it and return the generated PDF file to the user.

To do so, I am trying to use headless-gl.

As far as I understood, I first need to get the gl context and then pass it to babylon engine:

var gl = require(‘gl’)(1024, 768, { preserveDrawingBuffer: true });

var engine = new BABYLON.Engine(gl, true, {
disableWebGL2Support: true

My issue is that I was not able to init the gl and it returns null.

Inside my Dockerfile, I use the following to install the dependencies for xvfb:

RUN apt-get update && apt-get install -y
&& apt-get clean

My server depends on mongo DB as well so inside my docker-compose.yml file, I wait for the DB container to get initialized before I load my express container:

command: mongodb:27017 – …/node_modules/.bin/nodemon --inspect= ./server.js

I think I need to updated my Dockerfile and docker-compose files with proper commands to load xvfb before running the node application but I am not sure how to do that.

I tried the following along with some other combinations but no luck so far:

command: mongodb:27017 – xvfb-run -s “-ac -screen 0 1280x1024x24” node ./server.js

I appreciate if someone can help me resolve the issue.

I have no clue about this one, but did you see:

Thank you for getting back to me. Yeah, I’ve seen these. I can’t go with Puppeteer approach as I don’t want to open up a whole page and take a screenshot of that. Using CreateScreenshotUsingRenderTarget, my code takes multiple in-memory screenshots of a randomly generated mesh from different angles, do some images processing on it and then generates a PDF out of it. So taking a single screenshot of the generated page output is not sufficient in my case. The issue is that I need a virtual frame buffer inside the docker container to do this. This can be provided by headless-gl but I was not able to bring it into life so far. I’m pretty sure that this is because of mis-configuration on my Dockerfile/docker-compose.yml files.

Here is what we use in our tests:

export DISPLAY=:99
Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
sleep 3 # give xvfb some time to start

I unfortunately have no idea for the docker side.

You made my day! Thanks a million!
I updated my docker-compose.yml file like this:

      - /bin/sh
      - -c
      - |
        export DISPLAY=:99
        Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 & mongodb:27017 -- ../node_modules/.bin/nodemon --inspect= ./server.js

And Voilà! I was able to get the headless-gl working. Now I need to take care of the rest of my code to handle screenshots.

1 Like