Nuxt i18n 默认选项致法语首页被 Google 显示为英文

译注：本文编译自 dev.to 作者 dibodev 的技术复盘，原文标题为《My French homepage showed up in English on Google. A default Nuxt i18n option was the reason.》，记录了作者排查自家法语站点在 Google 搜索结果中显示英文标题的全过程。原文链接见文末。

一个以法语为默认语言的 Nuxt 静态站点，在 Google 搜索结果里却显示英文标题，并附带“翻译此页面”链接。作者在排查后发现，问题并不在服务端渲染的 HTML，而在于 @nuxtjs/i18n 一个默认开启的选项——detectBrowserLanguage。

服务端一切正常

作者的站点采用 Nuxt 4 静态生成（SSG），配合 @nuxtjs/i18n，策略为 prefix_except_default：法语在根路径 /，英文在 /en，西班牙文在 /es。

用 curl 抓取 / 的原始 HTML，结果完全正确：

shell

curl -s https://dibodev.fr/ | grep -o 'lang="[a-z]*"\|<title>[^<]*</title>' | head -2
# lang="fr"
# <title>Dibodev — Développeur Web Freelance à Rennes</title>

canonical 指向 /，hreflang 标签也正确：fr-FR → /、en-US → /en、es-ES → /es、x-default → /。即便使用 Googlebot 的 User-Agent，服务器返回的仍是同一个法语页面，状态码 200。

服务端没有问题，那么问题只能出在浏览器端。

用英文浏览器复现

Google 并不只是下载 HTML，它会在无头 Chrome 中渲染页面并执行 JavaScript。而爬虫不会声明自己使用什么语言。作者用 Playwright 以英文浏览器 locale 打开首页：

python

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch()
    for locale in ["fr-FR", "en-US"]:
        page = browser.new_context(locale=locale).new_page()
        page.goto("https://dibodev.fr/", wait_until="networkidle")
        print(locale, "->", page.url, "|", page.title())
    browser.close()

输出结果：

plaintext

fr-FR -> https://dibodev.fr/ | Dibodev — Développeur Web Freelance à Rennes
en-US -> https://dibodev.fr/en | Dibodev — Freelance Web Developer in Rennes

问题复现了。任何设置为英文的浏览器访问 /，拿到法语 HTML 后，会在水合完成后立即被重定向到 /en。使用 Googlebot 的 User-Agent 结果相同。对渲染器而言，/ 的内容就是英文页面。

元凶：一个默认选项

作者从未主动要求语言重定向，但 @nuxtjs/i18n 的 detectBrowserLanguage 选项默认开启。默认情况下它只作用于根路径，并通过 cookie 记住用户选择。对真实访客来说，这体验不错：英语用户会落到英文站点。

但在预渲染站点上，重定向无法在服务端发生——HTML 早已生成。它只能在浏览器中、应用启动后执行。而一个英文 locale、没有 cookie 的无头浏览器，每次都会触发重定向。

作者的配置里从未提及该选项：

typescript

// nuxt.config.ts (before, simplified)
i18n: {
  locales: [
    { code: 'fr', language: 'fr-FR', file: 'fr.json' },
    { code: 'en', language: 'en-US', file: 'en.json' },
    { code: 'es', language: 'es-ES', file: 'es.json' },
  ],
  defaultLocale: 'fr',
  strategy: 'prefix_except_default',
},

修复：一行配置

typescript

// nuxt.config.ts (after)
i18n: {
  // ...same as before
  strategy: 'prefix_except_default',
  // No redirect to the browser language: crawlers render in English and were sent from / to /en.
  detectBrowserLanguage: false,
},

访客仍可通过语言选择器切换语言，搜索引擎也已通过 hreflang 了解所有版本。这也符合 Google 的建议：不要根据浏览器语言把用户重定向到某个语言版本，而是链接各版本并让用户自行选择。

部署后，同样的 Playwright 脚本输出：

plaintext

fr-FR -> https://dibodev.fr/ | Dibodev — Développeur Web Freelance à Rennes
en-US -> https://dibodev.fr/ | Dibodev — Développeur Web Freelance à Rennes

为什么值得关注：AI 搜索同样受影响

作者注意到这个问题，是因为他正在研究自己的站点如何在 AI 回答（ChatGPT、Copilot、Perplexity、Google 的 AI 模式）中呈现。Copilot 和 ChatGPT 依赖 Bing 的索引，而 Bing 同样会用浏览器渲染页面。一个在渲染时“变成英文”的首页，正是那种会让小型法语企业在法语查询中难以被推荐的混杂信号。

这是作者两天内在该站点上发现的第二个渲染陷阱。第一个是：部分项目描述在客户端渲染，而 GPTBot、PerplexityBot 等 AI 爬虫根本不执行 JavaScript，对它们来说这些文字根本不存在。

要点

@nuxtjs/i18n 默认启用 detectBrowserLanguage。在静态或对 SEO 敏感的站点上，应明确决定是否需要它。
用其他语言的浏览器测试页面，而不只是用 curl：水合后的重定向不会出现在原始 HTML 中。
爬虫渲染你的站点时没有你的 cookie，往往也没有你的语言。检查它们看到的内容，而不是你自己看到的。

作者已请求 Google 重新抓取首页，并将在法语标题重回搜索结果后更新原文。

原文链接

https://dev.to/dibodev/my-french-homepage-showed-up-in-english-on-google-a-default-nuxt-i18n-option-was-the-reason-56c1

Nuxt i18n 默认选项致法语首页被 Google 显示为英文 ​

服务端一切正常 ​

用英文浏览器复现 ​

元凶：一个默认选项 ​

修复：一行配置 ​

为什么值得关注：AI 搜索同样受影响 ​

要点 ​

原文链接 ​

相关文章