ブラウザの言語設定からロケールを自動判定する - #14
Merged
Merged
Conversation
ログイン前の画面は VITE_DEFAULT_LOCALE（既定 en）で固定表示され、 言語の切替UIはサイドバーにしかないため、日本語環境のユーザーでも ログインするまで英語のままだった。 ロケールの解決順を Cookie → Accept-Language → 既定値 に変更する。 判定はSSRの detectLocale で行い、結果は <html lang> として出力される。 クライアントの検出順は cookie → htmlTag のままなので、サーバーと クライアントの判断が一致し hydration mismatch は起きない。 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
背景
ログイン前の画面（
/login/signup/verify-otp）は必ずVITE_DEFAULT_LOCALE（既定en）で表示されていた。i18n/config.tsの検出順が["cookie", "htmlTag"]でブラウザ言語の判定を行っておらず、切替UI（LanguageSwitcher）もサイドバーにしかないため、日本語環境のユーザーでもログインするまで英語のままだった。変更内容
ロケールの解決順を Cookie（ユーザーの明示的な選択） →
Accept-Language→VITE_DEFAULT_LOCALEに変更する。i18n/accept-language.ts（新規）:pickLocaleFromAcceptLanguage()。ja,en-US;q=0.9,en;q=0.8を q 値の降順（同値なら記述順）に並べ、最初にサポート対象だったものを返す。q=0は無視し、対応言語がなければundefinedを返して既定値にフォールバックするi18n/server.ts:detectLocaleが Cookie 不在時にaccept-languageヘッダを見るi18n/config.tsのdetection.orderは変更しない。SSRで決めたロケールが<html lang>として出力され、クライアントはhtmlTagからそれを読むため、サーバーとクライアントの判断が一致し hydration mismatch が起きない（navigatorを足すとこの一致が壊れるので、その旨をコメントに残した）VITE_DEFAULT_LOCALEの説明を新しい優先順位に合わせて更新判定に User-Agent は使わない（UAにはブラウザ・OSの情報しか含まれず、言語設定は入っていないため）。
動作確認
pnpm vitest（新規7件を含む63件）がグリーン。加えて dev サーバーに実際にヘッダを付けて確認済み。Accept-Language: ja,en;q=0.9lang="ja"Accept-Language: en-US,en;q=0.9lang="en"Accept-Language: ja;q=0.7,en;q=0.9lang="en"（q値が効く）Accept-Language: frlang="en"（既定値）Accept-Language: ja+Cookie: i18next=enlang="en"（Cookieが最優先）スコープ外
認証画面への
LanguageSwitcher設置（自動判定が外れたユーザーはログイン後に切り替えれば Cookie が残る）。🤖 Generated with Claude Code