Nginx无法加载.woff .eot .svg .ttf等字体文件的解决办法

李洋博客 2021-10-09 4.95 K阅读 2评论

温馨提示:这篇文章已超过922天没有更新,请注意相关的内容是否还可用!

很久之前写过windows20008服务器无法加载woff文件的问题,文章是:解决网站部署svg/woff/woff2字体404错误的方法,今天来说下Nginx无法加载woff的问题,我目前使用的是程序是lnmp,宝塔控制面板,使用的TP5,但是在后台访问的时候无法加载woff文件,页面提示502 bad gateway,使用f12查看开发者信息,所有的woff都是502,所有页面的小图片均已无法显示,如图:

Nginx无法加载.woff .eot .svg .ttf等字体文件的解决办法 第1张

按照网上教程有两个解决方案:一是添加woff后缀到.conf配置文件,代码如下:

location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|eot|otf|ttf|woff|woff2|svg)$
    {
        expires      30d;
        error_log /dev/null;
        access_log /dev/null;
    }

注意,配置文件是存在的,仅仅需要添加其中的“|eot|otf|ttf|woff|woff2|svg”后缀即可,就是这些字体文件,添加进去即可,害怕设置错误的话还可以新建一个配置段落,代码如下:

#加载woff字体
    location ~ \.(eot|otf|ttf|woff|woff2|svg)$ {
        add_header  Access-Control-Allow-Origin *;
    }

这个是独立独立的段落,功能增加的是跨域代码,允许.woff等后缀文件进行跨域显示。问题解决了,很简单,几个代码,但是我还是有个疑问,为什么我的主站代码一切正常,这个测试站TP5却得手动添加呢?另外如果出现“ laravel 访问路由出现404 ”则需要添加如下代码:

location / {
    try_files $uri/ /index.php?$query_string;
}

这个文件没有遇到过,只是看见网上有人说了一句,所以我就添加在这里了,如果遇到了可以试试如上代码是否可用,如有其他问题请留言反馈,虽说我也不一定会,但是可以抛砖引玉啊,毕竟三个臭皮匠顶个诸葛亮嘛,哈哈哈!

文章版权声明:除非注明,否则均为老李笔记原创文章,转载或复制请以超链接形式并注明出处。

发表评论

快捷回复: 表情:
AddoilApplauseBadlaughBombCoffeeFabulousFacepalmFecesFrownHeyhaInsidiousKeepFightingNoProbPigHeadShockedSinistersmileSlapSocialSweatTolaughWatermelonWittyWowYeahYellowdog
评论列表 (有 2 条评论,4951人围观)
网友昵称:明月登楼
明月登楼 V 铁粉 Google Chrome 94.0.4606.81 Windows 10 x64 沙发
2021-10-09 来自上海 回复
竟然是ThinkPHP框架的博客呀,厉害了!
网友昵称:李洋博客
李洋博客 V 博主 Sogou Explorer Windows 10 x64
2021-10-11 来自上海 回复
@明月登楼 其实对TP一窍不通,哈哈!
取消
微信二维码
微信二维码
支付宝二维码