1. 백엔드

• 번역 미들웨어 적용

  • 기존 라우터에 미들웨어 추가

   // 기존 코드
  router.get("/users", verifyAccessToken, (req, res) => 
    userController.getUsers(req, res)
  );
  
  // 번역 미들웨어 추가
  router.get("/users", verifyAccessToken, defaultTranslationMiddleware, (req, res) => 
    userController.getUsers(req, res)
  );
  

  • 순서는 무조건 사용자 인증 미들웨어 뒤에( 사용자 인증보다 먼저 처리할 경우 쓸모 없는 번역 API 호출이 많아짐) → 인증되지 않은 사용자에게도 API 비용을 쓸 순 없음

• env에 api 키 추가 ( api 키 하나 당 번역 가능한 글자 수는 50만 글자로 이미 4천글자를 사용함.. 금방 되니까 조심)

2. 프론트

• 언어 파라미터 API 호출 시 추가

// 기존 API 호출
const response = await fetch('/api/users');

// 언어 파라미터 추가
const response = await fetch('/api/users?lang=en');

// 기존 코드
const getUsers = async () => {
  const response = await fetch('/api/users');
  return response.json();
};

// 언어 파라미터 추가
const getUsers = async (language?: string) => {
  const queryParams = language ? `?lang=${language}` : '';
  const response = await fetch(`/api/users${queryParams}`);
  return response.json();
};

• 리액트 쿼리랑 같이 사용할 때

import { useLanguageStore } from "@/stores/languageStore";

export const useUsers = () => {
  const { language } = useLanguageStore();
  
  return useQuery({
    queryKey: ["users", language], // 언어별로 다른 캐시
    queryFn: () => getUsers(language),
    staleTime: 60 * 1000,
  });
};

3. API 사용 예시

견적 요청 조회 API

GET /estimateRequests/active?lang=en

{
  "success": true,
  "hasActive": true,
  "data": {
    "departureAddress": "Jugong 1-gil, Sacheon-si, Gyeongnam",
    "arrivalAddress": "Bonap-ro 2, Gapyeong-gun, Gyeonggi-do",
    "movingType": "SMALL"
  }
}

주의사항

1. 성능 고려사항

• 번역 API 호출은 시간이 걸릴 수 있음 (2-3초) ← 이 부분을 해결하기 위한 노력이 필요할 듯
• 캐싱을 통해 중복 번역 방지
• 한국어 요청 시 번역하지 않아 빠름

2. 비용 고려사항