使用子域时字体不加载

Posted 2023-02-27

【中文标题】使用子域时字体不加载

【英文标题】：Fonts not loading when used subdomain

【发布时间】：2014-11-18 01:32:18

【问题描述】：

我的项目在通过 font-face 加载自定义字体时遇到问题。仅当我将子域 (static.domain.com) 用于静态资源时才会发生这种情况。 HTTP服务器响应是200/OK，但是Chrome DevTools中的请求是红色的，大小为0字节，但我不明白为什么。

我用于加载字体的 css：

@font-face 
    font-family: 'flexslider-icon';
    src:url('fonts/flexslider-icon.eot');
    src:url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
        url('fonts/flexslider-icon.woff') format('woff'),
        url('fonts/flexslider-icon.ttf') format('truetype'),
        url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
    font-weight: normal;
    font-style: normal;

HTTP 请求的标头没有子域：

Remote Address:server-ip:80
Request URL:http://domain.com/resources/vendor/flexslider/fonts/flexslider-icon.ttf
Request Method:GET
Status Code:200 OK
Request Headers]
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4
Cache-Control:no-cache
Connection:keep-alive
Cookie:42099b4af021e53fd8fd4e056c2568d7c2e3ffa8=47a0eb41255ef509f4f834a20b5e0a80; WEBSITE_LANGUAGE_ID=1; WEBSITE_LANGUAGE_CODE=pt-br; _gat=1; 2796f347b370f841cf4073d1b3834ec019e6d2f4=d37cabbc36cfaa34508ce57a4ed237e8; __utma=65801017.1238778210.1411492809.1411492809.1411492809.1; __utmb=65801017.10.10.1411492809; __utmc=65801017; __utmz=65801017.1411492809.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none); __zlcmid=Qye50l3YnSWoJv; WEBSITE_FORM_NEWS_TOKEN=%3DAFVxIkVWpVYWxmSW5UVkpWVwA3VVpmRSJlRalVUtVTVUFjWzV1aaNlYHpkdTxmVaN2aKVVVB1TP
Host:domain.com
Pragma:no-cache
Referer:http://domain.com/resources/build/all.css?v=1411407970
User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (Khtml, like Gecko) Chrome/37.0.2062.120 Safari/537.36
Response Headersview source
Accept-Ranges:bytes
Cache-Control:max-age=2592000
Connection:Keep-Alive
Content-Encoding:gzip
Content-Length:1201
Content-Type:font/ttf
Date:Tue, 23 Sep 2014 17:43:42 GMT
Expires:Thu, 23 Oct 2014 17:43:42 GMT
Keep-Alive:timeout=5, max=96
Last-Modified:Mon, 23 Jun 2014 20:51:58 GMT
Server:Apache/2.2.22 (Unix) mod_ssl/2.2.22 OpenSSL/0.9.8e-fips-rhel5 DAV/2 SVN/1.6.11 mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635
Vary:Accept-Encoding

HTTP 请求的标头带有子域：

Remote Address:server-ip:80
Request URL:http://static.domain.com/resources/vendor/flexslider/fonts/flexslider-icon.ttf
Request Method:GET
Status Code:200 OK
[Request Headers]
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4
Cache-Control:no-cache
Connection:keep-alive
Host:static.domain.com
Origin:http://domain.com
Pragma:no-cache
Referer:http://static.domain.com/resources/build/all.css?v=1411407970
User-Agent:Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.120 Safari/537.36
[Response Headers]
Accept-Ranges:bytes
Cache-Control:max-age=2592000
Connection:Keep-Alive
Content-Encoding:gzip
Content-Length:1201
Content-Type:font/ttf
Date:Tue, 23 Sep 2014 17:45:08 GMT
Expires:Thu, 23 Oct 2014 17:45:08 GMT
Keep-Alive:timeout=5, max=97
Last-Modified:Mon, 23 Jun 2014 20:51:58 GMT
Server:Apache/2.2.22 (Unix) mod_ssl/2.2.22 OpenSSL/0.9.8e-fips-rhel5 DAV/2 SVN/1.6.11 mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635
Vary:Accept-Encoding

请求之间唯一显着的区别是 cookie，没有子域 cookie 的请求不在请求中（回想一下，这是对静态资源使用子域请求的目标）。

【问题讨论】：

我在这里找到了解决这个问题的方法：***.com/questions/2892691/…

【参考方案1】：

正如@aalih在cmets中给出的答案，解决方法在这里：@font-face fonts only work on their own domain