Javascript Puppeter-自定义字体不以pdf格式加载，但会显示在屏幕截图中

我正在尝试使用Puppeter库动态创建PDF文件，但生成的PDF不使用自定义字体（.woff），而是使用默认系统字体，即Times new roman

我使用Next.js创建了这个网站，并做了一个相当复杂的设置来加载自定义字体以及侧样式组件。如果我不必搞乱Nextjs的设置，但不管怎样，都可以让它工作

我甚至添加了一个延迟（超时），只是为了确保在生成pdf之前正确下载字体，但没有成功。但是，截图显示了正确的自定义字体

如何让自定义字体显示在pdf中

生成pdf会导致背景色出现在某些div后面，我如何调试这些div，或者当网页/屏幕截图上的图像后面没有此类背景色时会出现什么问题

下面是我用来创建pdf的代码

木偶演员代码：

const puppeteer = require('puppeteer');
(async () => {
  const browser = await puppeteer.launch({headless: true});
  const page = await browser.newPage();
  await page.goto('https://threads-web.vercel.app/threads/1385978750743973894', {
    waitUntil: 'networkidle2',
  });
  // const document = await page.evaluate(() => document);
  // console.log(document.fonts) ----- This also returns undefined
  try {
    await page.screenshot({ path: 'beforeTimeout.png' });
    await page.waitForTimeout(15000);
    await page.screenshot({ path: 'afterTimeOut.png' });
    await page.evaluateHandle('document.fonts.ready');
    await page.pdf({ path: 'hn.pdf', format: 'a4' });
  }
  catch (err) {
      console.log(err)
  }

  await browser.close();
})();

Next.js:_app.js

const GlobalStyle = createGlobalStyle`
    @font-face {
    font-family: 'ProximaNova-Regular';
    src: url('/fonts/ProximaNova-Regular.woff') format('woff');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
  }
  @font-face {
    font-family: 'ProximaNova-Bold';
    src: url('/fonts/ProximaNova-Bold.woff') format('woff');
    font-style: bold;
    font-weight: 700;
    font-display: swap;
  }
`;
function MyApp({ Component, pageProps }) {
  const [open, setOpen] = useState(false);
  return (
    <>
      <ThemeProvider theme ={{colors: colors.light, bp: bp}}>
        <GlobalStyle />
            <Layout open={open} setOpen={setOpen}>
              <Component {...pageProps} />
            </Layout>
      </ThemeProvider>
    </>
  );
}

const GlobalStyle=createGlobalStyle`
@字体{
字体系列：“ProximaNova常规”；
src:url（'/fonts/ProximaNova Regular.woff'）格式（'woff'）；
字体风格：普通；
字体大小：400；
字体显示：交换；
}
@字体{
字体系列：“ProximaNova Bold”；
src:url（'/font/ProximaNova Bold.woff'）格式（'woff'）；
字体风格：粗体；
字号：700；
字体显示：交换；
}
`;
函数MyApp（{Component，pageProps}）{
const[open，setOpen]=useState（false）；
返回(
);
}

任何帮助都将不胜感激！谢谢