I am running Node backend in an AWS Lambda environment to create images on a FabricJS canvas. Everything is working fine except the fontFamily of the textboxes in the canvas.

I am storing my in a folder named fonts inside the src folder.

src
|----fonts
     |----fabric.conf
     |----Source
          |----SourceSansPro-Regular.otf
          |----SourceSansPro-Semibold.otf

I create a fonts.conf file as instructed from here: Include custom fonts in AWS Lambda

<?xml version="1.0"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
   <dir>/var/task/fonts/</dir>
   <cachedir>/tmp/fonts-cache/</cachedir>
   <config></config>
</fontconfig>

Environment variables are set

FONTCONFIG_PATH="/var/task/fonts"
FONTCONFIG_FILE="/var/task/fonts/fonts.conf"

I attempt to register the fonts and create the canvas, as instructed from here: http://fabricjs.com/fabric-intro-part-4#node

const { fabric } = require('fabric')

fabric.nodeCanvas.registerFont('fonts/Source/SourceSansPro-Regular.otf', {family: 'Source Sans Pro'})
fabric.nodeCanvas.registerFont('fonts/Source/SourceSansPro-Semibold.otf', {family: 'Source Sans Pro Semibold'})

const canvas = new fabric.Canvas('canvas', {})

canvas.loadFromJSON(canvasJson, async () => {
    ...
    canvas.renderAll()
    const dataURL = canvas.toDataURL({
        width: canvas.width,
        height: canvas.height,
        left: 0,
        top: 0,
        format: 'png'
    })
    console.log(dataURL)
})

Here is an excerpt of canvasJson

"objects": [
    ...
    {
        "shadow": null,
        ...
        "type": "textbox",
        ...
        "fontFamily": "Source Sans Pro Semibold",
        ...
    },
    ...
]

The resulting dataURL contains the default font and not the desired font, see image below.