[Firebase] Cloud Messageing (알림창 띄우기) Feat. APNS

안녕하세요!

오늘은 Firebase를 이용해 알림창 띄우기를 해보도록 하겠습니다ㅎㅎ

알림창이 주로 사용되는 곳은 공지 띄우기, 물 마시기 알림, 재난 문자 등등으로 많이 사용되는것을 알수 있습니다.

그럼 조금만 더 자세히 알아볼까요?

 

---

Firebase Cloud Messageing

remote notification(원격 구성)을 손쉽게 관리하고 전송할 수 있는 Firebase의 플랫폼으로, 줄여서 FCM이라고 합니다.

 

이후부터는 FCM으로 사용하겠습니다 ㅎㅎ

 

FCM의 역할은 ? 🧐

원격 알림 메세지 전송

: 사용자에게 표시되는 알림 메시지를 실시간 또는 예약 전송

 

다양한 메시지 타겟칭

: 단일 기기, 기기 그룹, 주제를 구독한 기기

 

발송 메시지 저장, 관리

: 알림 내용, 상태, 플랫폼, 최종 전송 시간, 열람율 관리

 

 

자! 저희가 이용할 FCM에 대해 알아보았으니, 이제 사용해봐야겠죠?

 

---

 

1. FCM 설정하기

처음 설정해보시는 분들은

[Firebase] 프로젝트에 연결하기 글을 참고해주세요!

 

 

2. APNS 구성

먼저 APNS가 뭘까요..?

Apple Push Notification service 의 약자로 APN이라고 부르기도 합니다.

 

정의는 아래와 같습니다.

 

"third party 개발자가 우리 앱에 푸시 알람을 보낼 수 있도록

Apple에서 만든 알림 서비스 플랫폼 " 

 

third party 개발자 - push server을 말하며

해당 기능을 사용하기 위해서는

Project에

Push Notifications을 추가해주어야합니다.

 

 

project에서 Signing & Capabilities을 눌러준 후,

+ 에서 Push Notification을 추가해줍니다.

 

 

간단하죠?ㅎㅎ

자 이제 프로젝트에 설정을 해놨으니!

계정과 Firebase를 연결하러 가봅시다ㅏ

 

3.  Apple Developer Key 생성

 

Push Notification을 이용하려면 Apple Developer 계정에서

Key를 생성해야합니다.

 

 

Certificaties, Indentifiers & Profiles 에서 

Keys를 누른 후, 추가해줍니다.

 

 

키 이름을 자유롭게 적은 후,

Apple Push Notifications service(APNs)를 체크해 줍니다.

 

그럼 위와 같이 키 ID와 Download가 생기는데,

여기서 ID를 복사한 후 파일을 Download를 해주면 끝입니다 :D

 

 

4. Firebase 설정

 

이제 Apple Developer Key를 

Firebase에 등록해주도록 합니다!

 

 

Firebase 프로젝트의 설정에 들어가서

클라우드 메시징을 선택해줍니다.

 

 

저희는 APN 인증키를 등록해야하죠?

업로드 버튼을 눌러줍니다!

 

3번에서 Key ID를 붙여 넣기 해주고, 

Download해준 파일을 드롭한 후 업로드 해줍니다

 

드디어 프로젝트와 Developer, Firebase까지 설정을 다 끝마쳤습니다 :D

이젠 코드를 작성해서 직접 연결해봅시당

 

 

5.  코드로 Firebase 연결하기

 

Firebase를 연결하기위해서는 framworK를 import해주어야겠죠?

 

 

위와 같이 import 해줍니다.

 

위 이미지처럼 코드를 작성하면

FirebaseApp. configure()을 이용하여 Firebase와 연결해주고

권한 설정과 알림의 Display 형태를 설정해주는 Delegate까지 설정해줍니다.

 

이정도면 끝난거 아닌가 싶은데,,,

아직 마지막 순서가 남았습니다!

 

Firebase 즉, 저희의 Push Server에 Device Token을 알려줘야

Push Server로부터 타겟팅한 알림을 앱의 특정 인스턴스로 전송할 수 있습니다.

그렇다면 FCM이 이러한 등록 토큰을 기반으로 액세스 할 수 있도록 작업을 해 주어야하겠죠?

 

일단 Token 값을 알아보러 가봅시다!

 

5-1.  FCM Token

 

이 Token은 최초 앱 시작할때 , 토큰이 업데이트 혹은 무효화될때마다 신규 또는 기존 토큰을 검색합니다.

 

 

위 처럼 코드를 작성한 후,

실행해보면 등록 토큰이 잘 나오는 것을 알 수 있습니다.

 

 

거의 다 왔습니다!!

이제 Firebase에서 위 토큰을 등록해주면 됩니다

 

6. Firebase 설정

 

이제 알림을 띄워보러 가봅시다!

 

 

Cloud Massaging을 선택해줍니다.

 

 

첫 번째 캠페인을 만들어봅시다

 

 

저희는 앱 외부에 있어도 알림 메시지가 수신되도록 해야하므로

첫번째를 선택하겠습니다

 

 

 

알림 제목과 텍스트를 적어주면

우측에 테스트 메시지 전송 버튼이 활성화됩니다.

눌러봅시다!

 

 

위 이미지와 같은 창이 뜨는데,

아까 위에서 알아낸 FCM Token을 복사하여 추가해줍니다.

 

 

간단하죠?

 

 

테스트 버튼을 누르면 위와 같이 제 Device에 알림창이 뜹니다.

잘 오는 것을 확인 했으니,

이제 세부 설정하러 가봅시다

 

 

타겟 앱을 설정해주고

 

 

원하는 예약 시간을 설정해줍니다.

 

 

 

 

설정을 완료하면 위와 같은 창이 뜨고 게시하면 저장됩니다.

 

 

설정 완료!

---

 

위와 같이 Apple 배지를 100으로 설정하면 어떻게 되는지 볼까요?

 

 

이렇게 출력됩니다!

---

 

++ 앱에 들어왔을때 창 없애기 코드 설정