在AWS Serverless环境中上传Canvas预构建图表字体的技术问题

我来帮你搞定这个在Serverless环境下用canvas生成图表时的字体加载问题！你遇到的Fontconfig error: Cannot load default config file是因为Lambda环境默认没有预装Fontconfig的配置文件，而canvas依赖它来管理字体。下面是一步步的解决方案：

1. 创建Fontconfig配置文件 #

首先，你需要在项目里添加一个fonts.conf配置文件，告诉Fontconfig去哪里找字体以及缓存目录（Lambda只有/tmp是可写的）。文件内容如下：

<?xml version="1.0"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
  <!-- 指定你的字体存放目录 -->
  <dir>./fonts</dir>
  <!-- 设置可写的缓存目录 -->
  <cachedir>/tmp/fontconfig</cachedir>
  <config></config>
</fontconfig>

把这个文件放到项目根目录或者和字体同目录下（比如./fonts/fonts.conf）。

2. 配置Fontconfig环境变量 #

你需要告诉Fontconfig去哪里找这个配置文件，可以通过两种方式：

• Lambda控制台设置：在你的Lambda函数的环境变量里添加FONTCONFIG_PATH，值为fonts.conf所在的目录路径。比如如果文件在项目根目录，就设为./；如果在./fonts里，就设为./fonts。
• 代码中手动设置：在调用registerFont之前添加这行代码：

  process.env.FONTCONFIG_PATH = './fonts'; // 根据你的实际路径调整
  

3. 确保字体和配置文件被打包进Lambda部署包 #

检查你的Serverless配置（比如serverless.yml），确保字体文件夹和fonts.conf都被包含在部署包里。示例配置：

package:
  include:
    - fonts/** # 包含fonts下所有文件
    - fonts.conf # 包含配置文件

如果你用的是那个Lambda调用器，也要确认它没有排除这些文件，确保打包时它们能被一起上传到Lambda。

4. 调整代码执行顺序和路径检查 #

• 确保registerFont的调用时机在初始化chartjs-node-canvas之前，比如：

  const { registerFont, CanvasRenderService } = require('chartjs-node-canvas');
  
  // 先设置Fontconfig路径
  process.env.FONTCONFIG_PATH = './fonts';
  // 注册字体
  registerFont('./fonts/Montserrat-Bold.otf', { family: 'Montserrat', weight: '900' });
  // 再初始化渲染服务
  const canvasRenderService = new CanvasRenderService(width, height);
  

• 可以添加路径检查代码，确认字体文件存在，方便排查问题：

  const fs = require('fs');
  console.log('Font file exists:', fs.existsSync('./fonts/Montserrat-Bold.otf'));
  

5. 提前创建Fontconfig缓存目录 #

Lambda的/tmp目录虽然可写，但Fontconfig需要的缓存目录可能不会自动创建，所以可以在代码开头添加：

const fs = require('fs');
const cacheDir = '/tmp/fontconfig';
if (!fs.existsSync(cacheDir)) {
  fs.mkdirSync(cacheDir, { recursive: true });
}

按照这些步骤操作后，Fontconfig就能找到配置文件和你的字体，应该就能解决那个错误了。

内容的提问来源于stack exchange，提问作者Shubhanshu Ranjan