美文网首页
【解决】nginx代理nacos不显示 ttf|woff|wof

【解决】nginx代理nacos不显示 ttf|woff|wof

作者: liurongming | 来源:发表于2021-08-20 09:29 被阅读0次

    网上很多教程设置如下:

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

    此方法,适合项目本身部署在nginx项目中,且有跨域的问题。
    然而,本次是nginx做反向代理,所以对nginx的设置应有不同。
    现象:通过代理域名访问时不显示图标,但直接通过IP:PORT访问,可以显示。
    出现问题原因,一般如下:
    1、跨域问题。
    2、mime.types问题。
    3、路径问题。
    4、其它问题。
    通过一系列的排查,可得知:nginx 代理此次nacos字体不显示,仅属于“路径问题”。
    因此修改代理路径,问题即可解决:
    1、针对 eot|otf|ttf|woff|woff2 直接代理根路径。(注意svg单独剔除,走代理2)
    2、针对非上述文件或地址,代理到有nacos的上下文路径。

    server {
        listen  80;
        server_name nacos.xxx.com;
        #access_log /var/log/nginx/pro.log;
        keepalive_timeout 65;
    
        location  / {
             # 传递真实的请求头信息
             proxy_set_header Host $host;
             proxy_set_header X-Real-IP $remote_addr;
             proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    
            # 限制文件大小为10G
             client_max_body_size    10240m;
             # 指定代理服务器
             proxy_pass http://IP:PORT/nacos/;
        }
    
        location ~* \.(eot|otf|ttf|woff|woff2)$ {
            # add_header Access-Control-Allow-Origin $http_origin;
            proxy_pass http://IP:PORT;
        }
    
        error_page 500 502 503 504  /50x.html;
        location = /50x.html {
            root html;
        }
    }
    

    由此可见,nacos对前端资源路径的处理,存在规范性问题,并未统一上下文路径,给代理带来困扰。

    相关文章

      网友评论

          本文标题:【解决】nginx代理nacos不显示 ttf|woff|wof

          本文链接:https://www.haomeiwen.com/subject/iunzbltx.html