hsunny study blog

[Firebase] FCM (Firebase Clouding Messaging) + Ionic3 [2] 본문

programming/IONIC

[Firebase] FCM (Firebase Clouding Messaging) + Ionic3 [2]

헤써니 2018. 6. 19. 01:55

이전 이야기

http://withhsunny.tistory.com/41  


FCM을 사용하기 위한 환경설정을 이해했다면 본격적인 사용을 위한 준비를 해야 한다.

*IONIC에 FCM을 사용하기 위한 과정으로, 아래 과정은 일반 앱에 사용하는 것과 설치과정이 다를 수 있습니다.


사이트 주소 https://firebase.google.com/


1. 위 사이트로 이동하여 [콘솔로 이동]을 클릭합니다.


2. [프로젝트 추가]를 클릭하여 firebase 프로젝트를 추가를 진행합니다.



내용에 맞춰 프로젝트 이름과 ID, 국가/지역을 설정합니다.

프로젝트 ID는 실시간 데이터베이스 URL, Firebase 호스팅 하위 도메인 등에서 사용되는 서비스 전체에서 고유한 식별자입니다. 

ID는 자동으로 설정되나 빨간색으로 표시한 펜 아이콘을 클릭해 직접 수정할 수도 있습니다.

프로젝트를 만든 이후에는 수정할 수 없습니다.

약관에 모두 동의하면 [프로젝트 만들기] 버튼이 활성화되며, 버튼을 클릭하여 프로젝트 생성을 마칩니다.


3. 사용할 앱에 Firebase를 추가하기 작업을 진행합니다.


[iOS 앱에 Firebase 추가], [Android 앱에 Firebase 추가], [웹 앱에 Firebase 추가] 3개 중에 자신에게 필요한 것을 선택하여 다음 과정을 실행합니다.


ex) [iOS 앱에 Firebase 추가]

번들 ID를 입력하고 [앱 등록]을 클릭합니다.

*앱 닉네임과 App Store ID의 경우, 있는 경우에 작성합니다. (작성하는게 좋습니다.)

GoogleService-info.plist를 다운로드 합니다..

마찬가지로 [Android 앱에 Firebase 추가]도 진행하여, google-services.json을 다운로드합니다.

*추가하는 방법에 대한 설명은 단계별로 친절하게 되어 있어 생략합니다.


IONIC3에서 플러그인을 이용해 firebase를 사용할 예정이므로 1번과 2번 단계만 진행하고 건너뜁니다.

(iOS의 경우 3단계까지 진행합니다. cocoaPods 설치 필요)




[앱에 Firebase 추가] 작업을 마친 이후에 [프로젝트 설정] 화면에서 프로젝트에 대한 정보 추가 등의 수정이 가능합니다.



이렇게 해서 클라이언트 측에서 필요한 파일 생성은 마쳤다.

다음 장에서는 IONIC 앱에서 사용하기 위한 설정에 대해 포스팅하도록 하겠다.