nginx css或js无法加载的问题

昨天我在linux上配置好了相应的nginx和tomcat.然后把我的项目放在上面了.然后配置了相应的nginx的配置.加载首页的时候是没有问题的.如下图:


但是一旦进入了其他的页面就会因为css文件没有加载而导致排版错误.大概搞了一个多小时.在网上也找了很久但就是没有解决问题.有一个很奇怪的现象就是.我主页的css加载完全的没有问题.仔细一想我之前对tomcat这个下面的文件夹内的所有文件都进行了权限的修改.之后,由于我项目缺少一个包,后来又重新放入了一个新的war包.我就突然想起来.可能是我的权限问题.然后我使用chmod -R 777 /你的linux下项目的地址. 比如我的项目是WebShop,那么我实际用的是以我的命令是:

chmod -R 777 /home/hdy/tomcat/webapps/WebShop/

之后再重新刷新服务器,就发现没有任何的问题了.



最后,附上我的nginx中的配置文件.初学者,还不是很懂.如果配置文件有什么不对的地方.大家提醒一下我哈.


  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Nginx 用作静态资源服务器时,可能遇到 Vue 项目中 CSS加载问题。通常,这是由于 Nginx 配置不正确或缺少必要的配置所导致的。 首先,我们需要确保在 Nginx 中正确配置了静态资源的路径。可以在 Nginx 的配置文件中设置指向 Vue 项目的根目录,并设置正确的 location 规则来处理静态文件,如下所示: ``` server { ... root /path/to/vue-project; location / { try_files $uri $uri/ /index.html; } location ~* \.(css|js|gif|jpeg|jpg|png|svg|woff|woff2|ttf|eot|ico)$ { expires 1y; add_header Cache-Control "public"; } ... } ``` 上述配置中,我们使用 `root` 指令指定 Vue 项目的根目录,通过 `location /` 将所有的请求都交给 `index.html` 处理,以便 Vue Router 可以正确处理前端路由。 而对于静态文件,我们使用 `location ~* \.(css|js|...)` 正则匹配并添加相应的缓存和响应头。 在配置完成后,重新加载 Nginx 使配置生效。此时,在浏览器中访问 Vue 项目,应该能够正确加载 CSS 文件。 但如果仍然不能加载 CSS 文件,还需要检查 CSS 文件路径是否正确,并确保文件的读取权限设置正确。可以通过查看浏览器控制台的网络请求,以及 Nginx 的错误日志来进一步排查问题。 综上所述,要解决 Nginx 中 Vue 项目加载 CSS 文件的问题,需要配置正确的静态资源路径和相应的 location 规则,确保文件的读取权限正确,并及时排查报错的日志以便定位问题所在。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值