앱에서 사용되는 푸시알림을 공부해보자.
🟥 개요
- firebase 플랫폼 사용 : 모바일 밉 웹 애플리케이션 개발 플랫폼으로 운영체제에 상관없이 앱을 만들 수 있도록 해주는 개발 tool 이다.
푸시알림을 구현하기 위해서 FCM(Firebase Cloud Messaging) 이라는 기능을 이용할 것이다.

🟧 알림 종류
1. Notification : 앱이 실행중일 때만 푸시 알림
- 클라이언트 앱이 백그라운드에서 실행중일때 FCM SDK 가 앱을 대신 해 최종 사용자 기기에 메시지를 표시.
- 앱이 백그라운드 상태면 알림 메시지가 알림 목록으로 전송된다. 포그라운드 상태면 콜백 함수가 메시지를 처리한다.
ex :
{
"message":{
"token":"bk3RNwTe3H0:CI2k_HHwgIpoDKCIZvvDMExUdFQ3P1...",
"notification":{
"title":"Portugal vs. Denmark",
"body":"great match!"
}
}
}
2. Data : 앱의 실행상태와 상관없이 푸시 알림
- 클라이언트 앱이 데이터 메시지 처리를 담당. 데이터 메시지에는 예약 키 이름 없이 커스텀 키-값 쌍만 존재.
ex :
{
"message":{
"token":"bk3RNwTe3H0:CI2k_HHwgIpoDKCIZvvDMExUdFQ3P1...",
"data":{
"Nick" : "Mario",
"body" : "great match!",
"Room" : "PortugalVSDenmark"
}
}
}
🟨 BackEnd 구성
- google에서 제공하는 FCM 백엔드 와 서버 로직이 실행되는 자체 서비스 앱 서버 로 구성.
- backend -> FCM back -> client 순으로 통신을 요청.
- 지원 언어 : Node, java, Python, C#, Go
- 옵션
- FCM HTTP v1 API : 가장 최신 프로토콜 (새로운 기능 빠르게 적용)
- HTTP : 클라우드에서 기기로 전송하는 다운스트림
- 동기 메시징 : 앱 서버가 post 요청으로 메시지를 보내고 응답을 기다린다. 응답 수신 될 때까지 발신자가 다른 메시지를 보내지 못하도록 차단.
- 일반 텍스트 메시지 지원 o
- 여러 등록 토큰에 전송되는 멀티캐스트 다운스트림 지원 o
- HTTP v1으로 이전 : 공식문서에 따르면 이전이 필수인지 선택인지는 나와있지 않다. 코드 구현으로 테스트 필요.
- XMPP : 기기에서 클라우드로 전송하는 업스트림 및 클라우드에서 기기로 전송하는 다운스트림
- 비동기 메시징 : 앱 서버가 영구 XMPP 연결을 통해 모든 기기에서 양방향으로 메시지를 주고 받는다. 연결 서버가 확인 또는 실패 알림을 비동기 방식으로 보낸다.
- 일반 텍스트 메시지 지원 x
- 여러 등록 토큰에 전송되는 멀티캐스트 다운스트림 지원 x
- 프로토콜 구현 링크 : https://firebase.google.com/docs/cloud-messaging/server?hl=ko#implementing-the-http-server-protocol
🟦 앱 서버 전송 요청 작성
- 전송 가능 대상
- 주제 이름
- 조건
- 기기 등록 토큰
- 기기 그룹 이름 (node.js , firebase admin sdk , 기존 프로토콜 만 해당)
- 특정 기기 1개에 메시지 보내기
// This registration token comes from the client FCM SDKs.
const registrationToken = 'YOUR_REGISTRATION_TOKEN';
const message = {
data: {
score: '850',
time: '2:45'
},
token: registrationToken
};
// Send a message to the device corresponding to the provided
// registration token.
getMessaging().send(message)
.then((response) => {
// Response is a message ID string.
console.log('Successfully sent message:', response);
})
.catch((error) => {
console.log('Error sending message:', error);
});
성공 시 각 전송 메서드가 ID를 반환한다.

- 여러 기기에 전송 : 호출당 최대 500개의 기기 등록 토큰 지정 가능 (기기 등록 토큰 목록에 메시지를 멀티캐스트 하는 방식) - REST API 및 Admin FCM API 사용
// Create a list containing up to 500 registration tokens.
// These registration tokens come from the client FCM SDKs.
const registrationTokens = [
'YOUR_REGISTRATION_TOKEN_1',
// …
'YOUR_REGISTRATION_TOKEN_N',
];
const message = {
data: {score: '850', time: '2:45'},
tokens: registrationTokens,
};
getMessaging().sendMulticast(message)
.then((response) => {
console.log(response.successCount + ' messages were sent successfully');
});

- 주제로 메시지 전송
클라이언트 측의 인스턴스에서 주제를 구독하거나 서버 API를 통해 주제에 메시지를 전송할 수 있다.
주제 관리 reference : https://firebase.google.com/docs/cloud-messaging/manage-topics?hl=ko
프리미엄 서비스 같은 느낌이므로 구현 예시는 패스한다.
- 일괄 메시지 전송 : 최대 500개의 메시지를 일괄 항목 하나로 그룹화 한 후 단일 API 로 호출

🟩 알림 ui/ux 커스터마이징
- reference : https://firebase.google.com/docs/cloud-messaging/send-message?hl=ko
🟫 Referecne
공식사이트
-> https://firebase.google.com/docs/cloud-messaging/fcm-architecture?hl=ko
FCM으로 푸시알림 보내기 velog
-> https://velog.io/@server30sopt/FCM%EC%9C%BC%EB%A1%9C-%ED%91%B8%EC%8B%9C-%EC%95%8C%EB%A6%BC-%EB%B3%B4%EB%82%B4%EA%B8%B0