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.设置Access-Control-Allow-Origin

<FilesMatch "/.(ttf|otf|eot|woff)$"><IfModule mod_headers.c>Header set Access-Control-Allow-Origin "*"</IfModule></FilesMatch>

css加载字体跨域问题
css加载字体跨域问题标题图片

延伸阅读:

    无相关信息
标签:

上一篇:常用正则表达式大全——包括校验数字、字符、一些特殊的需求等等

下一篇:网页设计中字体规范总结

留言与评论(共有 0 条评论)
   
验证码: