Nginx路由配置后嵌套子页面直接访问报DNS_PROBE_FINISHED_NXDOMAIN错误如何解决？

优先排查DNS解析问题 #

你遇到的DNS_PROBE_FINISHED_NXDOMAIN错误和Nginx的location块配置完全无关，该错误是浏览器无法正常解析域名对应的IP地址导致的，先按以下步骤排查：

• 本地执行ping langyinan.com，确认返回的IP和你的服务器公网IP一致
• 检查域名服务商后台的解析配置，确认已经添加langyinan.com和www.langyinan.com两条A记录指向服务器IP
• 清理本地DNS缓存后重试：Windows系统执行ipconfig /flushdns，Mac系统执行sudo dscacheutil -flushcache; sudo killall -HUP mDNSResponder

SPA History模式的Nginx最佳配置 #

你当前使用的是前端History路由模式，现有Nginx配置本身已经覆盖了所有层级的路由需求，不需要额外新增location块。可以优化为以下配置，解决静态资源缓存、匹配错误的问题：

server{
        root /var/www/build;
        index index.html index.htm;
        server_name langyinan.com www.langyinan.com;

        # 静态资源单独匹配，设置长期缓存
        location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
            expires 1y;
            add_header Cache-Control "public, immutable";
            try_files $uri =404;
        }

        # 所有非静态资源请求全部回退到index.html，交给前端路由处理
        location / {
               try_files $uri $uri/ /index.html;
        }
}

你通过页面内按钮跳转二级路由正常，是因为跳转仅触发前端路由逻辑，没有向服务端发起新的页面请求。等DNS问题修复后，上述配置即可支持所有层级路由直接访问、刷新都正常。

关于Node服务路由方案的误解 #

你提到的用route.js统一管理路由需要代理到pm2托管的Node服务，仅适用于服务端渲染（SSR）、同构应用或者需要统一代理后端接口的场景。如果你的项目是纯前端静态单页应用，完全不需要启动Node服务，直接用Nginx托管静态构建产物即可，额外增加Node服务层只会增加不必要的运维复杂度。

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