Question

我公司最近开始尝试使用其中一个网站的AMP页面。这个过程非常有效，我们看到Google将我们的网页编入索引，以便在AMP轮播中使用：Mobile Google Search result for PennLive.com。

但是，我们的字体资源在Google轮播中返回404，尽管它们直接在我们的AMP页面上工作。

https://cdn.ampproject.org/r/www.pennlive.com/static/common/fonts/v1/benton-sans-medium/448c4642-c106-472f-9c6a-a4d7b5347b03-3.woff返回404

，而：

http://www.pennlive.com/static/common/fonts/v1/benton-sans-medium/448c4642-c106-472f-9c6a-a4d7b5347b03-3.woff返回200

在amphtml文档中，它表示必须通过http或https提供自托管字体，这正是我们为页面所做的，AMP页面显然正在验证。

为什么这些字体在Google AMP轮播中没有返回200？

示例页面：http://www.pennlive.com/articles/18505993/penn_state_commit_damion_barbe.amp

https://www.google.com/amp/www.pennlive.com/articles/18505993/penn_state_commit_damion_barbe.amp#development=1

Answer 1

您的服务器返回.woff字体文件的无效内容类型。

$ curl -I http://www.pennlive.com/static/common/fonts/v1/benton-sans-medium/448c4642-c106-472f-9c6a-a4d7b5347b03-3.woff

HTTP/1.1 200 OK
Date: Fri, 20 May 2016 17:27:48 GMT
Last-Modified: Wed, 18 May 2016 15:03:07 GMT
Accept-Ranges: bytes
Cache-Control: max-age=604800
Expires: Fri, 27 May 2016 17:27:48 GMT
Content-Type: text/plain; charset=UTF-8
X-Varnish: 198714588
Via: 1.1 varnish-v4
X-ADI-VCache: MISS
Content-Length: 54040
Connection: keep-alive

注意Content-Type: text/plain;

我认为您需要application/x-font-woff或font/woff

Answer 2

看到您的AMP页面会很有帮助;否则我试图推断可能发生的事情。

与Font Awesome字体有类似的问题。终于发现了这种方法：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"
  rel="stylesheet" 
  integrity="sha256-MfvZlkHCEqatNoGiOXveE8FIwMzZg4W85qfrfIFBfYc= sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" 
  crossorigin="anonymous"
>

我发现benton-sans-medium可能是您获得许可的字体。如果他们将为您提供字体，上面的方法可能会有用。

Google CDN未针对AMP网页缓存自托管的网络字体

2 个答案: