[Flutter]env로 API Key를 가려보아요

CHO WanGi·2024년 9월 15일

Flutter

목록 보기
25/27

준비물

  1. dotenv 패키지

    https://pub.dev/packages/flutter_dotenv

That's it!

근본적 물음, 왜 API KEY를 가려야할까

https://matthew.kr/%ED%95%B4%ED%82%B9-%EA%B8%B0%EB%A1%9D-%EA%B9%83%ED%97%99%EC%97%90-%EA%B5%AC%EA%B8%80-%ED%81%B4%EB%9D%BC%EC%9A%B0%EB%93%9C-api-key%EA%B0%80-%EB%85%B8%EC%B6%9C%EB%90%9C%EC%A7%80-13%EB%B6%84%EB%A7%8C/

대부분의 서비스는,클라이언트와 서버간 통신을 통해 데이터를 불러오고 저장한다. (CRUD라고도 한다)
이 과정에서 서버비 라는 걸 부담하는데,
이 Key 가 노출되면, 이름 모르는 누군가가 나쁜 마음을 먹고
요청을 몇천만번 보낸다든가...
그럼 그 서버비가 미친듯이 많이 나오기 때문에 반드시 가려주어야 한다.

Dotenv 사용해보기

패키지 설치

flutter pub add flutter_dotenv

먼저 패키지 설치가 필요합니다.

.env 파일 만들기

위 사진 처럼 프로젝트의 Root(최상단)에 .env파일을 생성해야합니다.

pubspec.yaml에 .env 등록

등록위치는 이미지를 등록할때도 사용되는 그 위치.
이를 등록해줘야 API_Key를 가릴 수 있다!!

.env 파일 내 변수 작성

이런식으로 key = value 형태로 작성해주시면 됩니다!

main() 함수 적용

  • WidgetsFlutterBinding.ensureInitialized();
    main() 에서 비동기 작업을 한 다음에 runApp()을 실행해 주는 기능을 합니다.

  • await dotenv.load(fileName: ".env");
    .env 파일을 가져오는 기능을 합니다.

.env 파일 활용하기

String baseUrl = dotenv.env["PROJECT_API_KEY"];

이렇게 문자열로 받아서 API_KEY를 가리면서 사용할 수 있습니다.

.gitignore 에 .env 추가하기

이걸 추가하지 않으면 .env가 올라가면서 API Key가 공개되는 대 참사가 일어날 수 있습니다
어떻게 알았냐구요?
저도 알고싶지 않았어요... 제가 이걸 추가하지 않았거든요

Conclusion

주된 목적은 API key 같이 노출되면 안되는 값들을 가리는 데 있지만
Merging, Test, Null Safety 등 편리하고 다양한 기능을 지원하고 있습니다.
꼭 API KEY 가리세요...ㅠ

profile
제 Velog에 오신 모든 분들이 작더라도 인사이트를 얻어가셨으면 좋겠습니다 :)

0개의 댓글