如何在phantomjs中使用google web字体
我使用的是phantomjs版本1.9.7,我相信它应该支持web字体。我已经插入了谷歌网页字体的字体,但当我自动截屏时,它只是显示我的备用字体。webfont在我的所有浏览器中都显示良好。有什么解决办法吗?我相信你的想法是错误的:-) Phantom的1.9.x系列仍然基于旧的WebKit代码,人们一直在报告web字体问题 好消息是幻影2.0的技术预览显然即将发布;目的是成为关注状态的最佳场所。而且,从记忆中,有人报告说网络字体使用成功(但我可能错了,因为快速搜索邮件列表档案并没有发现一条明确的消息,说网络字体可以工作……但它们肯定应该)如何在phantomjs中使用google web字体,phantomjs,webfonts,Phantomjs,Webfonts,我使用的是phantomjs版本1.9.7,我相信它应该支持web字体。我已经插入了谷歌网页字体的字体,但当我自动截屏时,它只是显示我的备用字体。webfont在我的所有浏览器中都显示良好。有什么解决办法吗?我相信你的想法是错误的:-) Phantom的1.9.x系列仍然基于旧的WebKit代码,人们一直在报告web字体问题 好消息是幻影2.0的技术预览显然即将发布;目的是成为关注状态的最佳场所。而且,从记忆中,有人报告说网络字体使用成功(但我可能错了,因为快速搜索邮件列表档案并没有发现一条明确
顺便说一句,基于Firefox的Gecko引擎,它几乎是一个昙花一现的替代品,并且确实支持web字体(尽管在角落案例中存在一些问题,IIRC)。我已经为这个问题挣扎了几个小时。好吧,这场争论的原因很简单:用户代理 一些服务,如谷歌字体,根据用户代理返回不同的CSS内容。当您使用默认PhantomJs用户代理调用包含Google字体的网页时,Google将返回PhantomJs支持的TTF版本 但是,如果设置一个自定义用户代理(Chrome、FF等),Google字体将返回
.woff2
版本<代码>.woff2在PhantomJs 2.x中不受支持。显然,不会加载字体
因此,对于那些在没有设置通用用户代理的情况下测试PhantomJs的用户来说,Google字体是可行的。如果他们设置了谷歌Chrome用户代理,它就不起作用了
因此,您有两种选择:
我刚刚对PhantomJS2.1.1也有同样的问题。
在我的例子中,我在一个代理下工作,该代理阻止PhantomJS从Google加载字体。连接到开放网络后,它正确呈现。我尝试了此处列出的所有修复程序,但均无效,但这里有一个解决方法。这两种选择都为我解决了这个问题 第一个选项: 在运行PhantomJS的本地计算机上安装缺少的web字体。包括谷歌在内的大多数网络字体提供商都允许您轻松下载字体进行本地安装。目标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'>
至:
<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。我正在将此添加到我的css:@import URL();我刚刚在Windows上试用了phantomjs 1.9.7版,捕获成功了。也许你可以尝试以同样的方式将其包括在内,因为存在多个回退。“我相信……”一个例子,甚至一个链接,让你相信这会有所帮助。这里有一个已关闭的问题:。然而,这仍然是一个令人不安的问题。一个it工作的例子将是最有用的。@st.derick Web字体在Phantom 1.x系列中不受支持,这是我在Phantom邮件列表中看到的。(slimer邮件列表中提到了slimer JS中web字体的角落案例问题。)@st.derick刚刚通读了这个错误问题。听起来我是怎么记得的-一团乱!有些人仍然说,即使使用PhantomJS 2.0,它也不能可靠地工作——听起来可能对Ubuntu软件包有一些复杂的依赖关系?即使在PhantomJS 2.1.1中,我也能够验证这一点。Mozilla/5.0(Macintosh;英特尔Mac OS X)AppleWebKit/534.34(KHTML,类似Gecko)PhantomJS/2.1.1(开发)Safari/534.34的默认UA(不带“Chrome”)似乎可以像您上面描述的那样工作。很好的捕获。到目前为止(2017年),情况正好相反:Google字体返回
。woff2
默认UA字体用户代理:Mozilla/5.0(Windows NT 6.2;WOW64)AppleWebKit/538.1(KHTML,像Gecko)PhantomJS/2.1.1 Safari/538.1
。所以为了解决这个问题,不应该设置任何标准的用户代理,例如PhantomJS/2.1.1
。@shytikov这正是答案中提到的。所以什么都没有改变。