플러터 API key 숨기기

플러터 어플을 만들면서 생각없이 api 키를 그대로 깃헙에 올렸다가 api 키가 그대로 노출된 것을 보고 다급히 커밋을 모두 삭제했다. 아까운 커밋들...ㅠㅜ 그러면서 깃헙 브랜치도 바뀌어 버려서 고생중. 

아무튼 여러 포스팅을 보며 따라해 봐도 게시된 대로 되지 않기에 해외 유튜브를 보고 참고하여 깃헙에서 api 키를 숨겼다.

 

 

참고한 유튜브 영상

https://www.youtube.com/watch?v=OtkrNQxJzBQ&ab_channel=Codepur 

 

 

위 영상을 보고 그대로 따라했다. 

 

 

API key 숨기기

1. 최상위 폴더(프로젝트명 폴더) 밑에 

.env 파일 추가하고 파일 내에 숨기고 싶은 정보를 입력한다. 

apiKey=api키 입력

 

 

2. .gitignore파일에

# API_KEYS
.env*

다음과 같이 추가

 

 

3. pubspec.yaml

flutter_config: ^2.0.0

추가 및 Pub get

 

 

4. main.dart에 다음과 같이 추가

void main() async {
  WidgetsFlutterBinding.ensureInitialized(); //추가
  await FlutterConfig.loadEnvVariables(); //추가
  runApp(const MyApp());
}

 

 

5. android > app > build.gradle

apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'
apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"

위 코드 밑에 

from: project(':flutter_config').projectDir.getPath() + "/dotenv.gradle"

추가

 

 

6. key는 다음과 같이 가져온다. 'apiKey'에는 .env 파일에 등록했던 본인이 출력하고 싶은 키의 변수를 입력한다.

FlutterConfig.get('apiKey')

main.dart에서 아래와 같이 apiKey를 불러왔을 때 키 값이 콘솔창에 잘 출력되었다.  

@override
Widget build(BuildContext context) {
  print(FlutterConfig.get('apiKey')); //추가
  return MaterialApp(
    title: 'weatherWeather',
      debugShowCheckedModeBanner: false,
    home: Loading(),
  );

 

 

+ 새로운 키를 추가했을 시 

안드로이드 스튜디오 상단 build > Make module '프로젝트명'을 클릭해서 키를 업데이트 시켰다.