Node Express 환경에서 다국어 처리
모듈 설치
npm i express ejs cookie-parser i18n코드
- app.js
const express = require('express');
const cookieParser = require('cookie-parser');
const i18n = require('./i18n');
const app = express();
//cookie 사용
app.use(cookieParser());
i18n.configure({
locales: ["en", "ko"], // 지원하는 언어 목록
defaultLocale: "en", // 기본 언어
directory: __dirname + "/locales", // 언어 파일이 저장된 디렉토리
objectNotation: true, // req 객체의 __ 함수 사용
cookie: "lang",
});
//i18n 초기화
app.use(i18n.init);
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "ejs");
//라우팅 설정
app.get('/', (req, res) => {
res.render("index");
});
app.post("/change-locale", (req, res) => {
const newLocale = req.body.locale;
res.cookie("lang", newLocale);
res.send("Language changed successfully");
});
//서버 실행
app.listen(4000);index.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.7.1/nouislider.css" integrity="sha512-MKxcSu/LDtbIYHBNAWUQwfB3iVoG9xeMCm32QV5hZ/9lFaQZJVaXfz9aFa0IZExWzCpm7OWvp9zq9gVip/nLMg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<title>Document</title>
</head>
<body>
<main>
<div >
<h2><%= __("test_title") %></h2>
</div>
</div>
</main>
<script>
const title = document.querySelector(`.nav-title`);
title.innerText = pathname.slice(1);
const Locale_Btn = document.querySelector("#locale_btn");
const currentLocale = "<%= currentLocale %>";
if (currentLocale === "en") {
Locale_Btn.innerText = "KO";
} else {
Locale_Btn.innerText = "EN";
}
console.log(currentLocale);
Locale_Btn.addEventListener("click", () => {
const newLocale = currentLocale === "ko" ? "en" : "ko";
fetch("/change-locale", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ locale: newLocale }),
})
.then((response) => {
if (!response.ok) {
throw new Error("언어 변경에 실패했습니다.");
}
return response.text();
})
.then((data) => {
// 성공적으로 언어가 변경되면 페이지를 새로 고칩니다.
location.reload();
})
.catch((error) => {
console.error("오류:", error);
});
});
//
</script>
</body>
</html>