使用Puppeteer生成含Fusion Charts的PDF时水印无法隐藏问题

根因说明 #

Fusion Charts 存在环境检测逻辑，会将 Puppeteer 无头模式的运行环境误判为未授权场景，同时你当前的授权配置时机、Puppeteer 等待策略也存在优化空间，共同导致水印在 PDF 中出现。

具体修复步骤 #

• 调整授权配置时机 #

  不要将授权配置包裹在 FusionCharts.ready 回调中，改为在 Fusion Charts 脚本加载完成后立即执行配置，避免配置延迟未生效。
  修改 EJS 模板的 head 部分代码：

  <head>
      <script src='https://cdn.fusioncharts.com/fusioncharts/3.16.0/fusioncharts.js'></script>
      <script src='https://cdn.fusioncharts.com/fusioncharts/3.16.0/themes/fusioncharts.theme.fusion.js'></script>
      <!-- 新增：脚本加载后立刻配置授权 -->
      <script>
          const _licenseKey = <%- JSON.stringify(licenseKey) %>;
          FusionCharts.options.license({ key: _licenseKey, creditLabel: false });
      </script>
  </head>
  

• 优化 Puppeteer 等待逻辑 #

  原配置中的 waitUntil: 'networkidle0' 只能保证网络请求空闲，无法保证图表异步渲染完成、授权已生效。需要显式等待图表渲染完成标识：
  1. 在 EJS 模板的图表初始化逻辑中添加渲染完成标记：

  FusionCharts.ready(function() {
      new FusionCharts({
        ...graphicData.data,
        events: {
          rendered: () => window.__FUSION_RENDER_DONE = true
        }
      }).render();
  });
  

  2. 在 Puppeteer 中新增等待逻辑：

  await page.setContent(content, { waitUntil: 'networkidle0', timeout: 15000 });
  // 等待图表渲染完成
  await page.waitForFunction('window.__FUSION_RENDER_DONE === true', { timeout: 10000 });
  

• 隐藏无头环境标识 #

  Fusion Charts 会检测 navigator.webdriver 属性判断是否为自动化环境，启动 Puppeteer 时添加配置绕过检测：

  const [page, browser] = await launchPuppeteer({ 
    clientTz,
    args: [
      '--no-sandbox',
      '--disable-setuid-sandbox',
      '--disable-blink-features=AutomationControlled'
    ],
    ignoreDefaultArgs: ['--enable-automation']
  });
  // 覆盖webdriver属性
  await page.evaluateOnNewDocument(() => {
    Object.defineProperty(navigator, 'webdriver', { get: () => undefined });
  });
  

• 兜底处理 #

  如果使用的 3.16.0 版本 Fusion Charts 本身存在无头环境兼容bug，无法通过配置解决，可在生成PDF前主动删除水印节点：

  await page.evaluate(() => {
    document.querySelectorAll('svg [class*="creditlabel"], svg text:contains("FusionCharts Trial")')
      .forEach(el => el.remove());
  });
  

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