4

I'm trying to create an AWS Lambda function to apply a watermarking effect on images. The original image will be pulled from S3, the watermarks applied and the results uploaded back to S3.

I'm using sharp to create these compositions with this code:

await sharp(inputImage)
              .rotate()
              .composite([{ input: new Buffer.from(watermark), tile: true, gravity: 'northwest' }])

With a custom watermark SVG

watermark = `<svg ... <text x="50%" y="100%" style="font-family:'Open Sans';font-weight:400;font-size:75px;font-style:normal;fill:rgba(128,128,128,1);stroke:none;" text-anchor="middle">${event.watermarkName}</text></g></svg>`;

Inside the SVG there is a text element that I dynamically change to contain a specified string. For example, I can put (c) Company Name on one image and (c) John Doe on another.

The code works when is running on my machine, but once inside a Lambda function with Node.js 12.x runtime this is the result Example of text watermark

As you can see I specified Open Sans as the font to be used. I, in fact, put the OpenSans-Regular.ttf file in /fonts/, created a fonts.conf file and set a FONTCONFIG_PATH='/var/task/fonts' as described in this question.

Nonetheless, fonts are still not working. Does anyone have suggestions about how I can fix this?

Francesco
  • 429
  • 4
  • 12

2 Answers2

8

Well asking Stackoverflow helped me finding the answer on my own, so I'm sharing in case anyone stumbles across this problem in the future.

AWS Lambda does not appear to support even basic fonts on it's own. For this reason, you will need to include you onw fonts as files inside the deployment zip file.

In my case this worked:

  • Creat a /fonts folder and inside placed all the files needed (in my case OpenSans-Regular.ttf).

  • Put a file named fonts.conf inside this folder

    <?xml version="1.0"?>
    <!DOCTYPE fontconfig SYSTEM "fonts.dtd">
    <fontconfig>
       <dir>/var/task/fonts/</dir>
       <cachedir>/tmp/fonts-cache/</cachedir>
       <config></config>
    </fontconfig>
    
  • Tell Lambda where the config file is by creating an environment variable

     FONTCONFIG_PATH='./fonts'
    

And voilà!

Working example

Francesco
  • 429
  • 4
  • 12
  • 1
    `FONTCONFIG_PATH ` did not work for me. only `FONTCONFIG_FILE="/var/task/fonts.conf"` worked for me. – cyrf May 12 '21 at 00:51
  • Has anyone been able to configure this in an Edge Lambda where environment variables cannot be set? – windowsill Mar 01 '22 at 00:16
  • Got it working by setting the envvar programmatically `process.env['FONTCONFIG_PATH'] = './fonts';` – windowsill Mar 01 '22 at 00:33
1

Worked for me also with the FONTCONFIG_FILE="/var/task/fonts.conf"

desertnaut
  • 57,590
  • 26
  • 140
  • 166
  • This does not provide an answer to the question. Once you have sufficient [reputation](https://stackoverflow.com/help/whats-reputation) you will be able to [comment on any post](https://stackoverflow.com/help/privileges/comment); instead, [provide answers that don't require clarification from the asker](https://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can-i-do-instead). - [From Review](/review/late-answers/30453352) – Daniel Nov 29 '21 at 13:37