Create-React-App部署Nginx后Icon PNG加载失败问题求助

嘿，我一眼就从你的Nginx错误日志和目录权限里揪出问题根源啦！

问题出在哪？ #

你的Nginx日志里反复出现Permission denied，再看你贴的文件权限：

-rw-------. 1 centos nginx 11910 Feb 8 15:25 logo192.png
-rw-------. 1 centos nginx 34013 Feb 8 15:25 logo512.png

这两个图标文件的权限是rw-------——意思只有文件所有者（centos用户）能读能写，而Nginx是用nginx组的身份运行的，完全没有读取这些文件的权限，自然就返回403禁止访问了。

怎么解决？ #

1. 给图标文件添加组读取权限 #

直接执行下面的命令，给这两个PNG文件开放组读取权限：

chmod g+r /var/www/Yeeplus/logo192.png /var/www/Yeeplus/logo512.png

执行完后再看权限，应该变成-rw-r-----，这样Nginx就能正常读取图标了。

2. （可选）验证+重启Nginx #

先确认权限改对了：

ls -l /var/www/Yeeplus/logo*.png

然后重启Nginx让设置生效：

sudo systemctl restart nginx

贴心小建议 #

为了以后部署新的build文件时不再踩这个坑，你可以直接给整个部署目录批量设置权限：

chmod -R g+r /var/www/Yeeplus/

这样所有静态资源都会自动给nginx组开放读取权限，省得每次都单独改文件~

内容的提问来源于stack exchange，提问作者Wayne Ho