解决Web部署 svg/woff/woff2字体get错误

nginx

1、没有发布成功原因

    先检查一下服务器上 对应的路径上有没有对应的文件

2、mime.types的原因 需要加对应的type,如

    application/x-font-truetype           ttf;

    application/x-font-woff               woff woff2;

3、同源策略的原因,跨域的问题

   在nginx.conf 添加如下:

        location ~* \.(eot|otf|ttf|woff|svg)$ { 

             add_header Access-Control-Allow-Origin *;

         }

4、nginx识别路径问题

 如果以上都不行,检查一下日志,如果出现

/etc/nginx/html/my-web/static/fonts/ionicons.d535a25.ttf" failed (2: No such file or directory), client:

则检查一下nginx.conf 下的 location的root 指定(需要保持一致),修改如下

        location / {

            root /www; 

            index index.html index.htm;

        }       


       location ~* \.(eot|otf|ttf|woff|svg)$ {

            root /www;

             add_header Access-Control-Allow-Origin *;

         }

IIS

不同的IIS版本,MIME的设置位置也不同,就不截图了,如果是IIS7或者更新的版本的话,一般是打开IIS面板后,单击左边的IIS图标,然后去右边的面板里面找一个叫“MIME 类型”的一个选项。如果是IIS6的话,右键网站,选择“属性”,“HTTP头”面板的下面有个“MIME 类型”。

需要添加哪些MIME 类型

文件扩展名 MIME类型

.svg → image/svg+xml

.woff → application/x-font-woff

.woff2 → application/x-font-woff2

.ttf → application/x-font-truetype

.otf → application/x-font-opentype

.eot → application/vnd.ms-fontobject

如果提示“已存在”就不需要添加了。