대학 식단 앱 개발-4

서론

오늘은 로그인 기능을 만들어 볼려고 한다. 식단 앱에 매뉴 평점을 기록해서 알려주는 기능을 구현 해보고 싶다. 실제로 넣을 지는 아직 모르지만 방법에 대해서는 미리 공부를 해보자.

로그인

구글이나 카카오나 다른 것들을 이용하는 건 결국 다 비슷할 거 같아서 구글 로그인을 하는 방식으로 해보자.
https://jaemoi8.tistory.com/3
https://jindduya.tistory.com/112
블로그를 참고해 보니 기본적으로 Cloud나 firebase를 쓰는 거 같다. google cloud는 로그인관련이라기 보다는 google에서 제공하는 클라우드 컴퓨팅 서비스인 거 같다. firebase는  google에서 만든 앱 개발 관련 플랫폼인 거 같다. firebase는 잘 모르지만 보기로는 앱의 틀만 구축을 하면 나머지는 다 알아서 관리를 해주는 거 같다. 여기에는 데이터베이스도 포함이되어 있다. 이 둘 다 제대로 사용할려면 돈을 내야 하는 거 같다. 우리는 그럴 돈이 없으니 무료 범위에서 해볼 생각이다. 

 

일단 Google Cloud로 진행을 해보았다. 어차피 둘 다 google에서 만들었고, 실제 적용까지 살짝 다르지만 대부분은 비슷할 거 같다. 주소나 결제 수단을 등록하면서 회원가입을 해주고, OAuth 동의를 해준다.(이 때 내부, 외부 선택하는 게 있는데 외부로 하는 게 맞는 거 같다)

이런 경고 문자가 항상 뜨긴 하는데 다른 기능을 안 쓰고, 로그인만 할 거면 신경 쓸  필요가 없을 거 같다.

 

이제 동의를 했으니 OAuth client를 생성해준다.

안드로이드로 만들 때 Package name이랑 SHA-1 certificate fingerprint를 써야 한다. Package name은 android/app/build.gradle.kts파일 내부에서 applicationId=’’에 있는 정보를 가지고 왔다.(여러 블로그를 보니깐 다 다른 곳에 있는 거 같다.1)

SHA-1 certificate fingerprint를 가지고 오기 위해 아래 코드를 윈도우 cmd에서 실행을 해보면

이렇게 오류 문자가 나온다. keytool이 없기 때문에 Java를 설치해서 해결해주자.

참고 : https://m.blog.naver.com/jonghong0316/223114917042

Java SE Development Kit 을 다운로드 해주면 될 거 같다. 그냥 open SDK를 다운로드 받아도 될 거 같지만 그냥 이것만 받으면 추가적으로 설정해줘야 할 게 있을 거 같다. 설치하면서 꼭 환경변수 설정도 해야 한다.(괜히 안 되는 것보다는 나을 거 같아서 그냥 다 설정했다)

 

이렇게 keytool을 설치를 해도 안 될 수도 있다. keystore가 있어야 하고, 해당 위치를 찾아야 한다.

Test-Path "$env:USERPROFILE\.android\debug.keystore"

이 명령어로  원하는 파일이 있는지 확인해 볼 수 있다.(실제 배포를 할 때는 release.keystore로 찾아야 할 거 같다.)

여기서 만약 false가 나온다면 keystore가 없는 거기 때문에

flutter build apk --debug

를 해서 keystore를 생성해준다.

dir "$env:USERPROFILE\.android\"

이 명령어로 리스트를 보면서 있는지 없는지 확인할 수 있다.

keytool -list -v `
 -keystore "$env:USERPROFILE\.android\debug.keystore" `
 -alias androiddebugkey `
 -storepass android `
 -keypass android

그 뒤로 이런 명령어를 사용해서 SHA1의 해쉬값을 얻을 수 있다.

https://growth-coder.tistory.com/171

https://godsman.tistory.com/entry/%EB%8F%84%EA%B5%AC-%ED%95%B4%EC%8B%9C%EA%B0%92-%EA%B5%AC%ED%95%98%EA%B8%B0-CertUtil

(window에서 keytool 설치 없이 CertUtil을 이용해서 할 수도 있을 거 같지만 해보진 않았다.)

(만약에 web application으로 client를 생성한다면 javascript랑 url 설정을 꼭 localhost로 해줘야 한다. 그래야 web flutter로 실행했을 때, 정상적으로 테스트 할 수 있다.)

 

이제 client 생성이 다 되었다.

 

그리고 Data access에서 얼마나 정보를 가지고 올지 선택할 수 있다.(이메일 같은 주소를 가지고 올려면 API 라이브러리같은 곳에서 People API를 enable로 만들어야 한다.)

 

https://phd-frog.tistory.com/46 : 카카오톡 로그인

DataBase

https://velog.io/@minsuhan1/Flutter%EB%A1%9C-%EB%A7%8C%EB%93%A0-%EA%B0%84%EB%8B%A8%ED%95%9C-%EC%BB%A4%EB%AE%A4%EB%8B%88%ED%8B%B0-%EC%95%B1

https://cloud.google.com/storage/pricing?hl=ko

두 방식 다 DataBase를 제공한다. Firebase가 인증 방식도 쉽게 할 수 있어서 매우 편한 거 같긴 하다. 만약에 기능을 넣게 된다면 유료 버전으로 쓰는 게 관리도 편하고 훨씬 좋을 거 같다.

 

일단 SQLite, MySQL, PostgreSQL에 대해 알아보면 이 3개는 SQL의 작동을 하게 하는 시스템인 거 같다.  

로컬에서는 SQLite로 테스트를 해볼려고 했는데 이게 flutter web으로 실행을 하면 api 서버에 접근 하는게 어렵고, flutter window로 하면 로그인을 이용할 수 없었다. 안드로이드 emulator를 쓸려고 하면 컴퓨터 스펙이 딸려서인지 모르겠지만 자꾸 멈춘다.. 

 

그래서 바로 render에서 지원하는 PostgreSQL을 이용해서 구현을 하기로 했다.(무료로 1GB정보를 이용할 수 있다.) 사실 설정할 게 별로 없다. 거의 다 optional이다. 근데 이름 같은 건 직접 해주는 게 편할 거 같다. (생성 과정에서 Datadog라는 걸 설정을 할 수가 있다. Datadog 사이트에 접속해서 계정을 만들어서 API KEY를 얻으면 DB를 모니터링 할 수 있는 거같다.)

flutter로 만든 앱에서 바로 DB에 접근할 수 있지만, 보안이 문제가 되기 때문에 중간에 서버를 만들어야 한다. 기본적으로 DB예 접근하기 위해서는 DB 서버 주소, port, dbname, username, password를 알고 있으면 된다. 만약 사용자가 로그인을 하면, 서버에서 진짜 구글로 로그인 한 게 맞는지 판단을 하고, 맞다면 정보를 데이터 베이스에 업데이트를 하는 식으로 구성을 하면 되겠다.(render에서 이 둘의 연동이 매우 쉽다. 일부러 둘이 독립되어 있는 것처럼 할려고 했는데, render에서 자동으로 감시해서 데이터베이스를 내부 접근으로 바꿔주었다. )(앱을 만들 때, 로그인 한 게 유지가 되는지도 확인해 봐야 할 듯 하다.) 

서버에서 확인을 하기 위해선 Google에서 확인을 해야하기 때문에 web Client ID가 추가로 필요하다. 이 부분에 유의해야 한다.

 

이렇게 로그인도 하고 서버에 숫자를 저장할 수 있다. 만약 안 된다면 ID나 SHA-1 값이나 이런 값들이 다 맞는지 확인 해봐야 한다. 

Firebase를 쓰면 다 알아서 해줄 거 같다. 돈이 있다면 이걸 쓰도록 하자.

 

https://www.postgresql.org/

위 사이트에서 PostgreSQL를 다운로드 받으면 로컬 데이터베이스를 구출할 수 있는 거 같다.

여담으로 주소나 키 같은 민감한 정보를 소스 코드에 넣어야 할 때 .env 파일을 이용하는 게 보안상 좋다. render에서 이런 걸 좀 더 편하게 관리할 수 있따. 서버에서는 환경변수를 설정해서 이용할 수 있다. 

끝

친구가 에타에 글을 올려봤는데 다들 반응이 좋은 거 같다. 뭔가 많이 썼으면 좋겠다.

구글 플레이 스토어랑 앱 스토어에서 해당 앱을 배포를 하게 될 거 같다. 둘 다 돈을 내야 하고, 그렇게 막 적은 돈은 아니였다. 철저한 본인인증도 하는 거 같다. 심지어 구글 플레이 스토어는 베타 테스터도 모집을 해야 하는 거 같다. 이 글을 마무리 할 때는 앱 스토어와 구글 스토어에서 다운로드가 되는 거 같다.

후기

아직 문제가 있는 부분이 있긴 하지만 앱 구조, 서버 구조, 구축 이런 측면에서 필요한 내용을 얼추 공부를 해본 거 같아서 이제 글은 끝이다. 그리 긴 시간은 아니였지만, 이렇게 앱 개발을 해보는 과정이 그래도 재미있었다. 인공지능이 있었음에도 수작업으로 해야하는 일들도 꽤 있었고, 서버랑 데이터 베이스에 대해서 배워보고 싶었는데, 이 기회에 조금이라도 알게 되어서 좋았다. UI말고 백엔드 위주로 했는데 나는 이게 잘 맞는 거 같다.

 

이 개발을 하면서 인공지능을 정말 많이 썼다. 뭔가 이렇게 한 주제로 오래 써본 것은 거의 처음인 거 같다. 개발쪽에서 인공지능의 활용이 너무 치명적인 거 같다. 중간 중간 dart언어를 알면 좋겠다라는 순간이 많았지만, 몰라도 무리가 있진 않았을 거 같다.(데이터 베이스관련은 알아 두는 게 수정하기 편할 거 같다.)