javascript - 使用 Chrome headless 浏览器获取呈现的字体

标签 javascript google-chrome puppeteer

我一直在查看 Chrome headless 浏览器文档,但到目前为止无法找到此信息。

是否可以在网站上捕获呈现的字体?此信息可通过 Chrome 开发者控制台获得。

enter image description here

最佳答案

Puppeteer 不直接公开此 API,但可以使用原始开发工具协议(protocol)获取“渲染字体”信息:

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.stackoverflow.com/');

  await page._client.send('DOM.enable');
  await page._client.send('CSS.enable');
  const doc = await page._client.send('DOM.getDocument');
  const node = await page._client.send('DOM.querySelector', {nodeId: doc.root.nodeId, selector: 'h1'});
  const fonts = await page._client.send('CSS.getPlatformFontsForNode', {nodeId: node.nodeId});

  console.log(fonts);
  await browser.close();
})();

可在此处找到 CSS.getPlatformFontsForNode 的开发工具协议(protocol)文档:https://chromedevtools.github.io/devtools-protocol/tot/CSS#method-getPlatformFontsForNode

关于javascript - 使用 Chrome headless 浏览器获取呈现的字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47911613/

相关文章:

javascript - JPG转div JS+循环

javascript - 为什么我无法向 window.location 添加参数?

css - Chrome 中的错误或糟糕的 CSS? (隐藏可见性的 anchor )

node.js - 即使某些 promise 被拒绝或仍在进行中,如何等到一个 promise 完成?

javascript - 与 puppeteer 师一起刮 table

javascript - 如何使用 Puppeteer 执行右键单击?

javascript - 我想在失去互联网连接时显示警报消息状态

Javascript 全屏切换重置用户视口(viewport)位置

php - Node.js 和 JSON

html - 星标 ★ 在 Chrome 中不显示