nginx部署前端h5项目后手机刷新浏览器报错404问题解决

当使用Nginx部署前端H5项目后，在手机上刷新浏览器出现404错误，这通常是因为Nginx没有正确配置来处理前端路由导致的。在单页应用（SPA）中，前端路由通常会使用一个通用的入口文件（如index.html）来处理所有的路由。因此，当用户刷新或者直接访问一个非入口文件的路由时，服务器需要返回这个入口文件，而不是返回404错误。

解决这个问题，你需要在Nginx的配置文件中设置一个合适的try_files指令。这个指令会告诉Nginx如果请求的文件不存在，就返回一个指定的默认文件。下面是一个配置示例：

server {
    listen 80;
    server_name example.com; # 替换为你的域名或IP

    root /path/to/your/front-end; # 替换为你的前端项目根目录
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

在这个配置中，`try_files $uri $uri/ /index.html;` 这一行是关键。它告诉Nginx首先尝试返回请求的文件（$uri），如果没有找到文件，则尝试返回请求的目录（$uri/），如果还是没有找到，就返回根目录下的`index.html`文件。

更新配置后，记得重启Nginx服务以使新的配置生效。