<aside> 🔔

하이브리드앱 FCM 푸시 알림 연동 가이드입니다. Firebase Cloud Messaging의 푸시 토큰 저장, HTTP v1 API 메시지 규격, Android·iOS 푸시 발송 흐름을 설명합니다.

</aside>

하이브리드앱 웹소스 연동 가이드 전체보기

1.연동 프로세스

1)앱실행시 푸시솔루션으로 부터 푸시토큰이 생성됨.(최초한번 유니크한 푸시키)

2)웹소스상에서 이 푸시토큰을 가져와 사용자별로 db에 저장필요(로그인 인증처리시 해당사용자의 계정과 함께 저장)

3)해당사용자의 푸시토큰을 db에서 가져와 해당사용자에게 푸시발신

2.푸시토큰 연동가이드

1)db 사용자 테이블에 푸시토큰 필드 생성필요

• 생성타입 : varchar(64)

2)사용자 로그인시(인증완료시) 사용자테이블에 해당사용자로 푸시토큰을 저장시킴(update)

3)아래처럼 웹소스를 사용하여 푸시토큰을 가져올수 있음(어느 페이지에서든 사용가능)

// 앱단 메세지 핸들러 호출상태 체크 함수
function waitForCallHandler(callback_func, attempts = 0) {
    if (window.webkit && window.webkit.messageHandlers) {
        callback_func();
    } else if (attempts < 100) { // 100회까지 시도
        setTimeout(function() {
            waitForCallHandler(callback_func, attempts + 1); // 시도 횟수를 증가
        }, 100);
    } else {
        //console.log('waitForCallHandler: 최대 시도 횟수에 도달했습니다.');
    }
}

//javascript 함수선언(푸시토큰을 받을수 있는 함수)
function get_pushid(pushid) {
	//푸시토큰 확인(푸시토큰 저장처리등의 로직이 들어가면 됨)
	alert(pushid);  //푸시토큰 확인(테스트용)
}
	

//메세지 핸들러 호출함수
waitForCallHandler(function() {
    window.webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify({"action": "getpushid","callback": "get_pushid"}));
});

//참고사항)아래처럼 곧바로 로컬스토리지를 사용해 조회할수도 있으나,
//최초 한번 앱설치후 실행시엔, 약간의 지연시간이(수초내외) 생겨 가져오지 못할수 있음.
$(document).ready(function(){
//document.addEventListener("DOMContentLoaded", function(){
	pushid = localStorage.getItem("pushid");
})

3.푸시발신 메세지 페이로드 규격

푸시발신 api는 HTTP V1 API 방식으로 아래 구글가이드를 참고하세요. 구글가이드 : https://firebase.google.com/docs/reference/fcm/rest/v1/projects.messages