我正在使用 phantomjs 版本 1.9.7，我认为它应该支持网络字体。我已经用谷歌网络字体插入了字体，但是当我自动抓屏时它只是显示我的后备字体。网络字体在我所有的浏览器中都显示良好。有什么解决方法吗？
【问题讨论】：
我已经为这个问题苦苦挣扎了几个小时。好吧，这个争议有一个简单的原因：user-agent！
某些服务（例如 Google 字体）会根据用户代理返回不同的 CSS 内容。当您调用包含 Google Fonts 带有默认 PhantomJs 用户代理的网页时，Google 将返回 PhantomJs 支持的 TTF 版本。
但是，如果您设置自定义用户代理（Chrome、FF 等），Google 字体将返回 .woff2 版本。 PhantomJs 2.x 不支持.woff2。显然，字体不会被加载。
因此，对于在没有设置通用用户代理的情况下测试 PhantomJs 的用户，Google 字体可以正常工作。如果他们设置例如 Google Chrome 用户代理，它就不起作用。
所以，你有两个选择：
【讨论】：
Mozilla/5.0 (Macintosh; Intel Mac OS X) AppleWebKit/534.34 (KHTML, like Gecko) PhantomJS/2.1.1 (development) Safari/534.34 的默认 UA（没有“Chrome”）似乎可以按照上述方式工作。不错的收获。
User-Agent: Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1 返回 .woff2 字体。因此，要解决问题，应设置非标准用户代理，例如 PhantomJS/2.1.1。
我相信你的想法是错误的 :-) Phantom 1.9.x 系列仍然基于旧的 WebKit 代码，人们一直在报告 Web 字体问题。
好消息是 Phantom 2.0 的技术预览版显然即将发布； https://github.com/ariya/phantomjs/wiki/PhantomJS-2 旨在成为关注状态的最佳场所。而且，从记忆中，有人报告说使用它的网络字体成功（但我可能错了，因为快速搜索邮件列表档案并没有出现明确的消息说网络字体有效......但他们肯定 应该）。
顺便说一句，SlimerJS 几乎是一个替代品，基于 Firefox 的 Gecko 引擎，并且支持网络字体（尽管在极端情况下存在一些问题，IIRC）。
【讨论】：
我刚刚遇到了与 PhantomJS 2.1.1 相同的问题。 就我而言，我正在使用阻止 PhantomJS 从 Google 加载字体的代理。连接到开放网络后，它可以正确呈现。
【讨论】：
我尝试了此处列出的所有修复都无济于事，但这里有一个解决方法。任一选项都为我解决了这个问题。
第一个选项： 在运行 PhantomJS 的本地计算机上安装缺少的 Web 字体。包括 Google 在内的大多数网络字体提供商都允许您轻松下载字体以进行本地安装。目标 URL 无需更改。
第二： 我可以控制我的网站，我可以通过拆分链接标签来解决。
更改自：
<link href='//fonts.googleapis.com/css?family=Roboto:400,500,700|Open+Sans:400italic,700italic,400,700' rel='stylesheet' type='text/css'>
收件人：
<link href='//fonts.googleapis.com/css?family=Roboto:400,500,700' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700' rel='stylesheet' type='text/css'>
我知道这不是一个理想的解决方案，但任何一个都可以，这取决于您是否可以修改目标 URL。
【讨论】：