指南
浏览器语言检测
检测用户浏览器的语言。
默认情况下，Nuxt i18n 模块通过检测用户浏览器的语言来尝试将用户重定向到他们首选的语言。此功能由 detectBrowserLanguage 选项控制。
nuxt.config.ts
export default defineNuxtConfig({
i18n: {
detectBrowserLanguage: {
useCookie: true,
cookieKey: 'i18n_redirected',
redirectOn: 'root' // 推荐
}
}
})
为了更好的 SEO，建议将
redirectOn 设置为 root（这是默认值）。设置后，语言检测仅在用户访问网站的根路径（'/'）时进行。这允许爬虫访问请求的页面，而不是根据检测到的区域进行重定向。这也允许链接到特定语言的页面。浏览器语言是通过 navigator 在客户端运行时检测，或者通过 accept-language HTTP 头部来检测。配置的 locales（或在以对象形式指定语言环境时的语言和/或代码）将与浏览器报告的语言环境进行匹配（例如 en-US,en;q=0.9,no;q=0.8）。如果没有找到完全匹配的语言环境，则将语言代码（在 - 之前的字母）与配置的语言环境进行匹配。
为了防止用户每次访问应用程序时都被重定向，Nuxt i18n 模块会利用检测到的语言环境设置一个 cookie。您可以通过将 detectBrowserLanguage.cookieKey 选项设置为您想要的任何名称来更改 cookie 的名称，默认值为 i18n_redirected。
nuxt.config.ts
i18n: {
detectBrowserLanguage: {
useCookie: true,
cookieKey: 'my_custom_cookie_name'
}
}
如果希望用户每次访问应用程序时都被重定向到他们浏览器的语言，请通过将 detectBrowserLanguage.useCookie 设置为 false 来禁用 cookie。
nuxt.config.ts
export default defineNuxtConfig({
i18n: {
detectBrowserLanguage: {
useCookie: false
}
}
})
要完全禁用浏览器的语言检测功能，请将 detectBrowserLanguage 设置为 false。
nuxt.config.ts
export default defineNuxtConfig({
i18n: {
// ...
detectBrowserLanguage: false
}
})
要在用户每次访问应用程序时重定向他们并保持他们的选择，请启用 alwaysRedirect：
nuxt.config.ts
export default defineNuxtConfig({
i18n: {
// ...
detectBrowserLanguage: {
useCookie: true,
alwaysRedirect: true
}
}
})
要在跨源环境中使用 cookie（例如在 iFrame 中），您可以将 cookieCrossOrigin 设置为 true。这将把 cookie 设置从 'SameSite=Lax' 改为 'SameSite=None; Secure'。
nuxt.config.ts
export default defineNuxtConfig({
i18n: {
detectBrowserLanguage: {
useCookie: true,
cookieCrossOrigin: true
}
}
})