client.ts - 客户端国际化

client.ts - 客户端国际化

概述

提供客户端语言切换功能，通过操作 Cookie 和页面刷新实现语言切换。

函数

setLocale

export function setLocale(locale: string): void

设置用户的语言偏好（客户端）。

功能:

  1. 设置 Cookie（NEXT_LOCALE），有效期1年
  2. 强制页面刷新以确保服务端使用新语言重新渲染

参数:

  • locale: 目标语言代码（如 "zh", "en"）

示例:

"use client";
import { setLocale } from '@/lib/i18n/client';

// 切换到中文
setLocale('zh');

// 切换到英文
setLocale('en');

注意:

  • 使用 window.location.reload() 进行硬刷新，确保即使使用 hash URL 也能正确刷新
  • Cookie 的 SameSite 属性设置为 Lax，保证安全性

getLocaleClient

export function getLocaleClient(): string | null

从浏览器 Cookie 中获取当前语言设置。

返回值:

  • string: 当前语言代码
  • null: 未找到语言设置

示例:

"use client";
import { getLocaleClient } from '@/lib/i18n/client';

const currentLocale = getLocaleClient();
if (currentLocale === 'zh') {
  // 当前是中文
}

使用场景

适用于需要在客户端 JavaScript 中切换语言的场景，如：

  • 语言选择器组件
  • 根据用户偏好动态调整界面
  • 读取当前语言以执行条件渲染
← 返回目录