[Flutter] API 키 숨기기 (feat. dotenv)

1. 개요

발급받은 API 키를 코드 안에서 직접 하드코딩한다면 

키가 외부에 노출되어 악용될 가능성이 있고,

팀 프로젝트를 진행한다면 일일이 자신의 키로 바꿔야 한다는 번거로움이 있을 것이다.

 

이를 해결해보자.

 

2. API 키 숨기기

키를 숨기기 위해 dotenv 패키지를 이용해보자.

 

dotenv는 앱 실행 시 설정 값을 불러와서 앱 전체에서 사용할 수 있도록 해주는 패키지다.

즉, API키와 같은 값을 .env파일에 저장하여 사용할 수 있는 것이다.

 

https://pub.dev/packages/flutter_dotenv

 

1) dotenv 패키지 설치

flutter pub add flutter_dotenv

 

 

2) .env 파일 생성

 

프로젝트 루트 디렉토리에 .env 파일을 생성한다.

 

 

3) pubspec.yaml 파일에 경로 추가

 

 

4) Main 함수에서 dotenv 파일 로드/초기화

 

void main() async {
  await dotenv.load(fileName: ".env");

  runApp(ProviderScope(child: const MyApp()));
}

 

여기서 주의할 점은 async로 비동기적으로 실행해야 한다는 점이다.

 

 

5) .env 파일에 변수 추가

NAVER_CLIENT_ID = 'YOUR_API_KEY'
NAVER_CLIENT_SECRET = 'YOUR_API_KEY'
VWORLD_KEY = 'YOUR_API_KEY'

 

싱글쿼트( ' ) 안에 api키를 작성한다.

 

 

6) .env 파일 변수 가져오기

 

api키가 필요한 곳에 .env 파일에 저장된 api키를 가져온다.

 

final locationRepository = LocationRepositoryImpl(
    dio: Dio(),
    naverClientId: dotenv.env['NAVER_CLIENT_ID']!,
    naverClientSecret: dotenv.env['NAVER_CLIENT_SECRET']!,
    vworldKey: dotenv.env['VWORLD_KEY']!,
  );

 

LocationRepository에서 통신하기 위해 API가 필요하기 때문에 이 부분에서 api키를 작성했다.

 

dotenv.env['YOUR_API_KEY'] 코드로 키를 가져올 수 있다.

 

 

7) .gitignore에 .env 추가

 

마지막으로 GitHub에 push 되지 않도록 gitignore 파일에 .env 파일을 추가한다.

.env

 

 

 

3. 정리

dotenv 패키지를 이용하여 API 키를 안전하게 관리해보았다.

 

키를 .env 파일로 분리함으로써 코드를 수정하지 않고도 키를 쉽게 교체할 수 있었다.

 

사소해 보이는 키 관리가 실제로 보안에 큰 영향을 미치니 앞으로 민감한 정보를 항상 .env 파일을 통해 안전하게 관리해야겠다.