css加载字体跨域问题,记录一下啊。
刚才碰到一个css加载字体跨域问题,记录一下啊。
站点的动态请求与静态文件请求是不同的域名的。站点的域名为 www.domain.com,而静态文件的域名为 st.domain.com。
问题:
页面中加载css文件:<link rel="stylesheet" href="http://st.domain.com/css/uniform.css" />
此css中调用了外部字体如下:
@font-face { font-family: 'FontAwesome'; src: url('../font/fontawesome-webfont.eot');
}
浏览器报请求跨域的错误。
解决方案:
我们使用Access-Control-Allow-Origin:* 通过启用cors 来解决跨域问题。
具体步骤如下:
1.开启apache的mod_headers模块
LoadModule headers_module modules/mod_headers.so
2.在st.domain.com的主机配置中加入
Header set Access-Control-Allow-Origin http://www.domain.com
重启apache。