NodeJS with Fastify but want to make an canvas (p5js server-side)

p5.js Libraries
12

Loading in JSDOM:

const virtualConsole = new VirtualConsole(),
      dom = new JSDOM(
        `
          <head>
            <script src="https://cdn.jsdelivr.net/npm/p5@1.1.9/lib/p5.js"></script>
            <script>${readFileSync("util/sketch.js")};</script>
          </head>
          <body>
            <div>foo</div>
          </body>`,
        {
          virtualConsole,
          runScripts: "dangerously",
          resources: "usable",
          pretendToBeVisual: true
        }
      );
    virtualConsole.sendTo(console);

Then just do the p5js stuff in the sketch file
And to send the data back I send back each frame as png
and sending it back via JSDOM virtual console.

console.info(c.canvas.toDataURL("image/png"))
1 Like