Всем привет!
Недавно мне понадобилось добавить поддержку нескольких языков в API на базе Express. Я решил поделиться кратким руководством для тех, кто хочет сделать свой бэкенд отвечающим переведенным контентом в зависимости от предпочтительного языка пользователя.
Зачем интернационализировать ваш бэкенд?
Вот несколько практических примеров использования интернационализации на бэкенде:
-
Отображение ошибок бэкенда на языке пользователя: Показывайте сообщения об ошибках на родном языке пользователя, чтобы улучшить понимание и снизить уровень фрустрации. Это позволяет отображать ошибки напрямую в уведомлениях без необходимости их сопоставления на фронтенде.
-
Отправка многоязычных электронных писем, push-уведомлений и т.д.: Повышайте вовлеченность, отправляя транзакционные, маркетинговые или уведомительные письма на языке получателя. Локализуйте push-уведомления, SMS-сообщения для обеспечения ясности и улучшения пользовательского опыта.
-
Получение многоязычного контента: Предоставляйте контент из вашей базы данных на нескольких языках.
Начало работы
Установка
Сначала установите необходимые пакеты, используя предпочитаемый вами менеджер пакетов:
npm install intlayer express-intlayer
Настройка
Далее, настройте параметры интернационализации, создав файл intlayer.config.ts
в корне вашего проекта:
// intlayer.config.ts
import { Locales, type IntlayerConfig } from "intlayer";
const config: IntlayerConfig = {
internationalization: {
locales: [
Locales.RUSSIAN,
Locales.FRENCH,
Locales.SPANISH_MEXICO,
Locales.SPANISH_SPAIN,
],
defaultLocale: Locales.RUSSIAN,
},
};
export default config;
Настройка приложения Express
Теперь настройте ваше приложение Express для использования express-intlayer
:
// src/index.ts
import express, { type Express } from "express";
import { intlayer, t } from "express-intlayer";
const app: Express = express();
// Загрузка обработчика запросов интернационализации
app.use(intlayer());
// Маршруты
app.get("/", (_req, res) => {
res.send(
t({
ru: "Пример возвращенного контента на русском языке",
fr: "Exemple de contenu renvoyé en français",
"es-ES": "Ejemplo de contenido devuelto en español (España)",
"es-MX": "Ejemplo de contenido devuelto en español (México)",
})
);
});
// Запуск сервера
app.listen(3000);
Совместимость
express-intlayer
работает беспрепятственно с react-intlayer
или next-intlayer
. Но он также совместим с различными решениями для интернационализации.
Настройка обнаружения локали
По умолчанию express-intlayer
использует заголовок Accept-Language
для определения предпочтительного языка клиента. Вы можете настроить это поведение для обнаружения локалей через заголовки или куки:
import { Locales, type IntlayerConfig } from "intlayer";
const config: IntlayerConfig = {
// Другие параметры конфигурации
middleware: {
headerName: "my-locale-header",
cookieName: "my-locale-cookie",
},
};
Не стесняйтесь ознакомиться с официальной документацией для более продвинутых настроек и возможностей, а также с официальным сайтом решения.
Автор: aymericzip