多语言页面切换报404的根源是路径映射与服务器路由未对齐：浏览器请求如/zh-CN/about.html，但服务器无对应物理文件且未配置fallback规则；需检查静态资源输出、Nginx/Apache兜底配置、与前端路由base一致性、代理拦截及构建public path计算。
多语言页面切换报404，基本不是翻译逻辑问题，而是路径映射和服务器路由没对齐——浏览器发出了一个带语言前缀（如 /zh-CN/about）的请求，但服务器根本没这个文件，也没配 fallback 规则。
检查 URL 前缀是否真有对应物理路径
很多项目用 href="/zh-CN/about.html" 这类写法，以为加个目录就能切语言，结果服务器在 zh-CN/ 目录下根本没放任何 HTML 文件。
- 打开 Network 面板，点开那个 404 请求，看
Request URL是不是类似http://localhost/zh-CN/about.html - 去服务器根目录下手动找
zh-CN/about.html—— 如果不存在，说明你没生成多语言静态页，或构建工具（如 i18n 插件）没输出到对应子目录 - 若只有一份
about.html在根目录，却硬写/zh-CN/about.html，那必须改路径：要么删掉前缀用/about.html+ JS 动态渲染语言内容，要么让构建流程自动产出zh-CN/、en-US/等子目录
Nginx/Apache 没配多语言 fallback 路由
即使你用的是单页应用（SPA）+ 前端 i18n（如 i18next），只要 URL 含 /zh-CN/ 这种前缀，刷新页面时浏览器就会直接向服务器要这个路径。Nginx 默认找不到，就返回 404。
- Nginx 必须在
location /块里加：try_files $uri $uri/ /index.html;—— 注意它不区分语言前缀，所有未命中资源都兜底到index.html - Apache 要确保
.htaccess里有重写规则，把/zh-CN/*、/en-US/*全部重写到index.html，且不能漏掉RewriteBase / - 如果用了子路径部署（如
https://example.com/app/zh-CN/），try_files或重写目标得改成/app/index.html，否则兜底失败
多语言站点常配合 base 配置）或构建工具（Vite 的 base）不匹配，所有跳转和资源加载都会错位。
- 查看页面源码，确认
href值是否与当前语言环境完全一致（注意结尾斜杠：/zh-CN/≠/zh-CN） - Vue 项目检查
router/index.js中createRouter({ history: createWebHistory('/zh-CN/') })是否和 - Vite 项目核对
vite.config.ts的base: '/zh-CN/'，CRA 项目看package.json的homepage字段 - 如果语言是运行时切换（非路径前缀），就别用
后端代理或 API 网关拦截了语言前缀
前后端同域部署时，比如前端路由是 /zh-CN/product，但 Nginx 或 API 网关（如 Kong、Traefik）把所有带 /zh-CN/ 的请求转发给了后端服务，而后者只认 /api/ 开头的路径，就直接返回 404 或 405。
- 在 Network 面板看 404 请求的
Response Headers里的Content-Type：如果是application/json或text/plain，说明后端已响应，前端根本没机会接管 - 检查 Nginx 的
location配置，确保/zh-CN/、/en-US/这类路径不被proxy_pass拦截，应优先匹配静态文件或兜底到 SPA 入口 - API 网关中排查是否有正则路由规则误匹配了语言前缀，例如
^/.*无差别转发
最易被忽略的一点：语言前缀是否参与了构建时的 public path 计算。比如 Vite 构建出的 assets/ 资源路径是 /zh-CN/assets/js/main.js，但 HTML 里写的却是 /assets/js/main.js —— 这种错位不会立刻报错，但一刷新就 404，而且 Network 面板里会看到多个资源级 404，而非仅页面级。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
