图标字体文件跨域访问不显示的解决方法_网站建设

　　图标字体文件使用非常方便，也加快了网站建设的速度和效率。同时在很多情况下实现图标字体跨域是非常方便的，可以制作JS、CSS、字体文件CDN，方便多个域名来调用。但是在进行字体文件跨域时需要进行一定的设置，不然就会出现图标字体文件跨域访问不显示的情况。以下是青锋建站－专业的网站建设公司给大家提供的apache和nginx下图标字体文件跨域访问不显示的解决方法。

apache下实现图标字体跨域

　　首先编辑httpd.conf找到这行
#LoadModule headers_module modules/mod_headers.so
把#注释符去掉 ，目的是开启apache头信息自定义模块
　　在Apache服务器中，将下面一行添加到服务器的配置中（在相应的<Directory>，<Location>，<Files>或<VirtualHost>部分中）。 配置通常位于.conf文件中（httpd.conf和apache.conf是这些文件的通用名称），或者位于.htaccess文件中。
Header set Access-Control-Allow-Origin 'origin-list'
对于Nginx，设置此http头的命令是：
add_header 'Access-Control-Allow-Origin' 'origin-list'

nginx下实现图标字体跨域

　　@font-face是CSS3中的一个特性，可以把自己定义的Web字体嵌入到网页中，随着@font-face，越来越多的网页采用字体图标作为网页中的小图形。
　　比如Bootstrap就采用了Glyphicons 字体图标 在Bootstrap的架构下可以免费使用Glyphicons的250多种图标字体。另外一个比较常用的开源图标字体就是Font Awesome了，内含几百种各种size的图标文件，可以很容易实现Fixed Width，Animated Icons，Rotated，Flipped，Stacked等特性，跟能和Bootstrap无缝配合。悦合同就是使用Font Awesome作为字体图标。
　　由于网站的资源文件使用的是另外的域名（这样做是便于浏览器在加载时可以提高加载效率，关于domain hash也就是多域名来加速访问的问题有空再说），这样主域名和资源的域名尤其是字体文件，就形成跨域访问，在主域名的网站无法加载资源域名中的字体。
　　处理这种跨域，只要设置Access-Control-Allow-Origin，允许目标域名访问就可以了，Access-Control-Allow-Origin是HTML5新增的一个特性，在资源类的域名下做如下配置（nginx的配置，apache相似处理）​

转载请注明来源网址：青锋建站-http://www.sjzphp.com/webdis/font_face_517.html