【Linux】Nginx无法加载.woff .ttf问题解决及laravel 访问路由404

最新推荐文章于 2024-06-18 15:58:16 发布
转载 最新推荐文章于 2024-06-18 15:58:16 发布 · 1.9k 阅读 · 0

本文详细介绍了如何解决Nginx配置中字体文件加载失败的问题，通过在配置文件中添加特定的location指令来允许跨域请求。同时，针对Laravel框架中常见的404路由错误，提供了修改location指令的解决方案，确保所有未定义路由最终指向index.php。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

Nginx无法加载.woff .ttf问题解决 需要在相关.conf 添加

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

laravel 访问路由出现404 修改为

location / {
        try_files $uri/ /index.php?$query_string;
  }
linux机上web项目添加font，nginx显示404问题（woff）及svn编码问题
yimi34的博客
04-01 4628
1.在项目中遇到如下问题：项目导入字体的一些文件.woff .eot .svg .ttf 然后部署到nginx上去，但是实际访问的时候，该类资源一直报404的错误。 该问题查找了好久，终于找到问题所在。 原来是访问域的问题，需要在其所在的nginx配置文件中添加本地对该类资源的访问 location ~ \.(eot|otf|ttf|woff|svg)$ { add_hea
【Nginx 】Nginx 部署前端 vue 项目
m0_74825746的博客
01-17 1609
在两种系统中，安装Nginx的过程都相对简单，主要区别在于使用的软件包管理器不同。这包括访问Vue应用的主页，以及尝试访问应用中的各个路由，确保它们都能正确加载。文件中列出的依赖项进行下载和安装，这个过程通常需要联网操作，并且依赖于npm仓库的响应速度。在网络状况良好的情况下，安装过程可以顺利完成。在CentOS或RHEL系统上安装Nginx的过程与Ubuntu/Debian略有不同，主要体现在软件包管理器的使用上。在项目部署之前，确保开发环境中已安装Node.js和npm，这是运行Vue项目的基础。
解决nginx下加载eot|otf|ttf|woff|svg等404 错误问题
热门推荐
feiz3020的专栏
09-18 1万+
1、没有发布成功原因     先检查一下服务器上 对应的路径上有没有对应的文件 2、mime.types的原因 需要加对应的type,如     application/x-font-truetype           ttf;     application/x-font-woff               woff woff2; 3、同源策略的原因，跨域的问题    在nginx...
nginx无法加载.woff .eot .svg .ttf等问题解决
0ng的博客
07-02 2659
最近在django部署到服务器上遇到了贼多问题 一开始svg加载不了，在网上乱来找了很多教程都没用，大部分都是这样讲的 # vi xx/xx/setting.py 在setting文件的最开始添加如下内容： import mimetypes mimetypes.add_type("image/svg+xml", ".svg", True) mimetypes.add_type("image/svg+xml", ".svgz", True) # ：wp 保存退出后重新运行项目，清空浏览器之前缓存即可显示图
laravel项目在linux环境访问除根目录外 出现404问题及解决
json_li的博客
04-11 1252
今天把项目部署到linux上配置好域名访问后，访问根目录一切正常，但是在访问其他路由时，出现404问题。 服务器 apache 框架 5.5 php 7.0 问题表现： 访问项目根目录没问题，访问其他目录必须在根目录后跟index.php然后接其他路由 比如：www.test.com/index.php/admin/user 这样的话 你原来的请求是 www.test.com/adm...
woff 404 woff2 404
happyfish2003的专栏
05-15 1122
问题：google fonts  国内不能使用，360加速也停止服务了，只能本地化，但是没效果，查看才知道  woff 格式 404。字体文件明明存在的，显示404.原因：因为服务器IIS不认SVG，WOFF/WOFF2 这几个文件类型，只要在IIS上添加MIME 类型即可。解决方法1、打开服务器IIS管理器，找到MIME类型。2、添加MIME类型 添加三条：　　       文件扩展名     ...
VUE 项目用 Docker+Nginx进行打包部署
CC酱写前端的博客
06-18 3358
这个文件将被 Nginx 加载以配置网站的行为，例如设置代理、重定向等。这意味着当你访问 Nginx 服务器时，这些静态文件将被提供给客户端。命令重新启动它，这次使用正确的端口映射。端口，你需要确保 Docker 容器的端口映射也相应地设置为。：指定基础镜像，这里使用的是 Nginx 的官方镜像，标签为。目录中的所有文件复制到 Nginx 的默认网页根目录。： 首先，你需要找到容器的 ID 或名称。命令加上容器的 ID 或名称来停止容器。这将覆盖默认的 Nginx 配置。命令列出所有正在运行的容器。
Nginx架构及配置详解
企业实战系列集 ●●● https://ximenjianxue.blog.youkuaiyun.com
09-10 5961
概述 Nginx采用C进行编写，是俄罗斯程序员开发的一款轻量级的可构建Web 服务器/反向代理服务器及电子邮件（IMAP/POP3）代理服务器的软件， Nginx服务器是一个高性能的HTTP和反向代理web服务器，同时也可提供了IMAP/POP3/SMTP服务。nginx常用作跑静态和做负载反向代理，动态php交给apache处理，因后者比较稳定，jsp交给tomcat、resin或jboss。n......
node vue 打包 部署 vendor.js文件太大的解决方式
qq_35410576的博客
09-24 662
node //建议改端口 不建议开代理 部署会很麻烦 //运行调试 npm run dev 开发 /config/index.js dev 建议改端口 port: 40003, 建议autoOpenBrowser: 由false改为true, 打包 // 打包 npm run build // 打包分析 npm run build --report js、css404解决方法 /config/index.js build中的assetsPublicPath: '/'改"./",/
核心需求 修复TTF字体在安卓小程序中的加载问题，确保字体文件能被正确加载和使用 帮我解决: TTF字体返回的Content-Type为application/octet-stream而非正确的font/truetype 技术环境 项目框架：ThinkPHP5 (TP5) 服务器环境：宝塔面板 运行目录：public 伪静态：已开启 字体路径：https://yinzhang.jinshelby.com/xcx/font/kaiti2.ttf 宝塔上路径是:/www/wwwroot/yinzhang.jinshelby.com/public/xcx/font/kaiti2.ttf 这是完整的Nginx主配置(nginx.conf) user www www; worker_processes auto; error_log /www/wwwlogs/nginx_error.log crit; pid /www/server/nginx/logs/nginx.pid; worker_rlimit_nofile 100000; stream { log_format tcp_format '$time_local|$remote_addr|$protocol|$status|$bytes_sent|$bytes_received|$session_time|$upstream_addr|$upstream_bytes_sent|$upstream_bytes_received|$upstream_connect_time'; access_log /www/wwwlogs/tcp-access.log tcp_format; error_log /www/wwwlogs/tcp-error.log; include /www/server/panel/vhost/nginx/tcp/*.conf; } events { use epoll; worker_connections 51200; multi_accept on; } http { include mime.types; # 已经包含标准字体类型定义 # 修正 MIME 类型定义（移除重复项） # 手动添加字体类型映射 types { font/truetype ttf; font/opentype otf; # application/font-woff woff; # application/font-woff2 woff2; } # 确保默认类型设置正确 default_type application/octet-stream; } # 移除重复的 default_type # default_type application/font-sfnt; // 注释掉这行 default_type application/octet-stream; #include luawaf.conf; include proxy.conf; server_names_hash_bucket_size 512; client_header_buffer_size 32k; large_client_header_buffers 4 32k; client_max_body_size 300m; sendfile on; tcp_nopush on; keepalive_timeout 60; tcp_nodelay on; fastcgi_connect_timeout 3000; fastcgi_send_timeout 3000; fastcgi_read_timeout 3000; fastcgi_buffer_size 64k; fastcgi_buffers 4 64k; fastcgi_busy_buffers_size 128k; fastcgi_temp_file_write_size 256k; fastcgi_intercept_errors on; gzip on; gzip_min_length 1k; gzip_buffers 4 16k; gzip_http_version 1.1; gzip_comp_level 2; gzip_types text/plain application/javascript application/x-javascript text/javascript text/css application/xml; gzip_vary on; gzip_proxied expired no-cache no-store private auth; gzip_disable "MSIE [1-6]\."; limit_conn_zone $binary_remote_addr zone=perip:10m; limit_conn_zone $server_name zone=perserver:10m; server_tokens off; access_log off; server { listen 888; server_name phpmyadmin; index index.html index.htm index.php; root /www/server/phpmyadmin; location ~ /tmp/ { return 403; } #error_page 404 /404.html; include enable-php.conf; location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ { expires 30d; } location ~* ^/xcx/font/.*\.(ttf|otf|woff|woff2)$ { root /www/wwwroot/yinzhang.jinshelby.com/public; # 添加详细日志 access_log /www/wwwlogs/font_access.log; error_log /www/wwwlogs/font_error.log notice; # # 强制设置正确的 Content-Type（重点） # if ($uri ~ \.ttf$) { # add_header Content-Type "font/truetype" always; # } # if ($uri ~ \.otf$) { # add_header Content-Type "font/opentype" always; # } # if ($uri ~ \.woff$) { # add_header Content-Type "font/woff" always; # } # if ($uri ~ \.woff2$) { # add_header Content-Type "font/woff2" always; # } # CORS 支持 if ($request_method = 'OPTIONS') { add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, OPTIONS'; add_header 'Access-Control-Allow-Headers' 'Range'; add_header 'Access-Control-Max-Age' 1728000; add_header 'Content-Type' 'text/plain charset=UTF-8'; add_header 'Content-Length' 0; return 204; } add_header 'Access-Control-Allow-Origin' '*' always; add_header 'Access-Control-Allow-Methods' 'GET, OPTIONS' always; add_header 'Access-Control-Allow-Headers' 'Range' always; add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range' always; # 缓存控制 expires 1y; add_header Cache-Control "public, max-age=31536000, immutable"; # 字节范围支持（安卓必需） add_header Accept-Ranges bytes; try_files $uri = 404; } location ~ .*\.(js|css)?$ { expires 12h; } location ~ /\. { deny all; } access_log /www/wwwlogs/access.log; } include /www/server/panel/vhost/nginx/*.conf; } 这是 网站的配置文件内容: server { listen 80; listen 443 ssl http2 ; server_name yinzhang.jinshelby.com; index index.php index.html index.htm default.php default.htm default.html; root /www/wwwroot/yinzhang.jinshelby.com/public; #CERT-APPLY-CHECK--START # 用于SSL证书申请时的文件验证相关配置 -- 请勿删除 include /www/server/panel/vhost/nginx/well-known/yinzhang.jinshelby.com.conf; #CERT-APPLY-CHECK--END #SSL-START SSL相关配置，请勿删除或修改下一行带注释的404规则 #error_page 404/404.html; #HTTP_TO_HTTPS_START if ($server_port !~ 443){ rewrite ^(/.*)$ https://$host$1 permanent; } #HTTP_TO_HTTPS_END ssl_certificate /www/server/panel/vhost/cert/yinzhang.jinshelby.com/fullchain.pem; ssl_certificate_key /www/server/panel/vhost/cert/yinzhang.jinshelby.com/privkey.pem; ssl_protocols TLSv1.1 TLSv1.2 TLSv1.3; ssl_ciphers EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5; ssl_prefer_server_ciphers on; ssl_session_tickets on; ssl_session_cache shared:SSL:10m; ssl_session_timeout 10m; add_header Strict-Transport-Security "max-age=31536000"; error_page 497 https://$host$request_uri; #SSL-END #引用重定向规则，注释后配置的重定向代理将无效 include /www/server/panel/vhost/nginx/redirect/yinzhang.jinshelby.com/*.conf; #ERROR-PAGE-START 错误页配置，可以注释、删除或修改 #error_page 502 /502.html; #ERROR-PAGE-END #PHP-INFO-START PHP引用配置，可以注释或修改 include enable-php-74.conf; #PHP-INFO-END #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效 include /www/server/panel/vhost/rewrite/yinzhang.jinshelby.com.conf; #REWRITE-END #禁止访问的文件或目录 location ~ ^/(\.user.ini|\.htaccess|\.git|\.env|\.svn|\.project|LICENSE|README.md) { return 404; } #一键申请SSL证书验证目录相关设置 location ~ \.well-known{ allow all; } #禁止在证书验证目录放入敏感文件 if ( $uri ~ "^/\.well-known/.*\.(php|jsp|py|js|css|lua|ts|go|zip|tar\.gz|rar|7z|sql|bak)$" ) { return 403; } location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|ttf)$ { expires 30d; error_log /dev/null; access_log /dev/null; } location ~ .*\.(js|css)?$ { expires 12h; error_log /dev/null; access_log /dev/null; } access_log /www/wwwlogs/yinzhang.jinshelby.com.log; error_log /www/wwwlogs/yinzhang.jinshelby.com.error.log; }
最新发布
07-05
我们正在解决TTF字体在安卓小程序中加载时返回错误Content-Type（application/octet-stream）的问题。目标是配置Nginx使其正确返回font/truetype类型。环境是ThinkPHP5框架，运行在宝塔面板上。 关键点： 1. 需要...
Nginx代理静态文件及eot、svg、ttf、woff字体文件
Lee_Mory的博客
03-03 3211
web需要访问本地静态资源 ，通常指定文件目录即可，但是有些特殊文件，需要解决跨域问题，如eot，svg等字体文件，则需要设置同源策略，如下： upstream ssl.52study.com { server 127.0.0.1:8888 weight=1; } server { # 此处省略，请看Nginx代理本地HTTPS中配置 } server { # 此处省略，请看Nginx...
nginx设置proxypass，报资源加载问题
peking1987的专栏
04-24 1305
1、如果设置/这种简单配置，那不会报任务错误 location / { proxy_pass http://IP:PORT/; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_s...
网站上传虚拟主机部署以后woff字体文件提示404不存在怎么办？
滴水石穿
01-20 808
网站上传虚拟主机部署以后woff字体文件提示404不存在怎么办？ 有客户最近在IIS上部署web项目的时候，进入调试模式发现浏览器console日志里总是报找不到woff、woff2字体的错误。导致浏览器加载字体报404错误，到底什么原因？ 这是因为服务器IIS默认是没有SVG,WOFF,WOFF2这几个文件类型的扩展的，所以如果要解决，我们就要在IIS上添加MIME类型即可。 解决方...
nginx跨域访问字体
☆→紾ゞ的博客
11-03 5827
今天突然遇到一个问题，网站用的主域名，然后它的资源文件也配置了一个res二级域名，导致css样式引用了字体样式报错 已拦截跨源请求：同源策略禁止读取位于 http://res.******/fontawesome-webfont.woff2?v=4.5.0 的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-Origin'）。 解决办法，在re
nginx字体跨域
qq_40679463的博客
05-04 726
nginx
字体图标文件服务器提示404,iis环境下字体图标woff/woff2/svg返回404不显示的原因与解决方法...
weixin_29338423的博客
08-05 1235
在IIS上部署web项目的时候，发现浏览器总是报找不到woff、woff2字体的错误，导致浏览器加载字体报404错误，因为服务器IIS不认SVG，WOFF/WOFF2，otf,eot,ttf 这几个文件类型，只要在IIS上添加MIME 类型即可。字体文件明明是存在的，但是却提示404，打开字体文件路径是这样的提示，MIME类型没添加，错误如下图：解决方法如下：一，如果你是服务器的话，打开服务器II...
.woff2/svg/woff文件报404错误
weixin_41262185的博客
08-17 1494
找不到woff、woff2字体或图标的错误 原因：因为服务器IIS不认SVG，WOFF/WOFF2 这几个文件类型，只要在IIS上添加MIME 类型即可。​ IIS7 解决办法： http://www.cnblogs.com/hanwen/p/4212622.html​ IIS6解决办法：http://blog.brain1981.com/682.html 详细如下: ​1、打开服务器IIS管理器...
【Linux】Nginx无法加载.woff .eot .svg .ttf问题解决
10年职场两茫茫，35岁凄凉奈若何
06-21 289
【Linux】Nginx无法加载.woff .eot .svg .ttf问题解决
linux nginx环境下,网站不显示字体和图形.(图形变成了方框),解决nginx下加载eot|otf|ttf|woff|svg等404 错误问题
yule117737767的专栏
06-25 2763
在nginx环境下, 网站上的图形或字体加载不了, 显示为方框. 配置问题,fontawesome图标字体库组件在服务器上显示不出来图标的问题. 先看看路径是否加载失败. .ttf 和.woff 文件, 确认路径正确 找到 nginx的配置文件 ,ps -ef | grep nginx 文件名 default_*.conf 加上 location ~* \.(eot|o...
nginx vue 不加载css
09-10
当 Nginx 用作静态资源服务器时，...综上所述，要解决 Nginx 中 Vue 项目加载 CSS 文件的问题，需要配置正确的静态资源路径和相应的 location 规则，确保文件的读取权限正确，并及时排查报错的日志以便定位问题所在。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值