moonstruck 개발일지: 서버리스 함수의 환경별 설정 자동화

그른손·2024년 11월 15일

🌟 서버리스 함수의 환경별 설정 자동화하기

Firebase Functions로 서버리스 환경을 구축하면서, 로컬 개발과 배포 환경의 차이로 인해 어느 환경에서 서버리스 함수를 테스트하느냐에 따라 귀찮게 자꾸 코드를 다시 작성해야 하는 문제가 있었습니다. 개발 환경에서 기능 만들면서 잘 작동하는지 확인하고, 배포한 후에 다시 작동 확인을 하는데, 그 때마다 클라이언트와 서버에서 redirect URI를 다르게 설정해줘야하는게 매우 매우 매우 귀찮을 것 같아서 그냥 딸깍 한번으로 처리할 수 없는지 고민했습니다.

🛠️ 내가 원한 동작

클라이언트:
- 서버리스 함수에 접근할 때, 배포 환경의 함수에 접근하느냐/로컬에서 에뮬레이터로 띄워둔 함수에 접근하느냐 따라 API 엔드포인트와 Kakao Redirect URI가 달라야 함. 이걸 .env를 직접 수정하는 대신 간단하게 처리할 수 있었으면 좋겠음.
서버:
- Firebase Functions에서 현재 함수가 돌아가고 있는게 개발 환경인지 배포 환경인지를 구분하고, 각각 적절한 redirect URI를 자동으로 설정해줬으면 좋겠음

🚀 구현한 방법

1. 클라이언트 환경

vite --mode test 명령어로 환경에 따라 VITE_FIREBASE_KAKAO_REDIRECT_URI와 VITE_FIREBASE_FUNCTIONS_API_URL를 다르게 설정하기

에뮬레이터로 띄운 서버리스 함수에 접근할 때: .env.local에 설정된 환경변수에 접근하여 에뮬레이터로 띄워둔 서버리스 함수의 주소(http://127.0.0.1:5001/내 프로젝트 id/~~~)에 접근함
배포 환경의 서버리스 함수에 접근할 때: vite --mode test로 .env.test 파일을 사용해 실제 배포된 서버리스 함수의 주소(https://지역-내 프로젝트 id.cloudfunctions.net)에 접근함

// package.json
"scripts": {
  "dev": "vite",
  "test-deploy": "vite --mode test"
}

이제 배포된 서버리스 함수 테스트할 때는 클라이언트를 npm run test-deploy로 실행하고, 에뮬레이터로 띄운 상태일 때는 npm run dev로 실행하면 됩니다.

서버리스 함수가 현재 환경을 확인하게 만들기

환경 감지: 개발과 배포 환경의 `process.env.NODE_ENV`

Firebase Functions에서 개발 환경과 배포 환경에서 환경 변수에 접근하는 방식이 다르다는 점을 이용해보기로 했습니다.

import { config } from 'dotenv';
config();

export const isProduction = process.env.NODE_ENV === 'production';

src/config/environment.ts에 이렇게 작성해주고, functions디렉토리의 .env에는 NODE_ENV=development로 넣어줍니다.
그리고 firebase CLI에서 firebase functions:config:set env.node_env=production 명령어로 firebase 환경변수의 NODE_ENV값을 production으로 설정해줍니다.

개발 환경:
process.env.NODE_ENV를 호출하면 functions 디렉토리의 .env 파일에 접근하여 설정된 NODE_ENV 값을 가져옵니다. 예를 들어, .env에 NODE_ENV=development가 설정되어 있다면 그대로 사용합니다.
배포 환경:
배포 환경에서는 로컬에만 존재하는 .env에 접근할 수 없으니, dotenv의 config으로 환경변수를 불러와도 아무것도 로드되지 않습니다.
대신, process.env.NODE_ENV는 우리가 CLI에서 설정한 firebase 환경변수인 NODE_ENV에 접근하고, production이라는 값을 가져옵니다.

환경에 따라 다른 비밀 불러오기:

export async function getKakaoRedirectUri(): Promise<string> {
console.log(process.env.NODE_ENV);
if (!isProduction) {
 console.log('개발 환경입니다.');
 const redirectUri = getSecret('KAKAO_REDIRECT_URI_DEV');
 console.log(`현재 redirectURI는: ${redirectUri}`);
 return redirectUri;
}
return getSecret('KAKAO_REDIRECT_URI');
}