Node.js에서 안드로이드, iOS 푸시 알림 구현 | 오늘의 맛집은? 라이크라이크

Sanghwa Lee·2022년 2월 7일

FCM (Firebase Cloud Messaging)

앱에서 푸시 알림을 구현해야 했다. 가장 흔히 사용하는 방법을 따라 FCM을 이용하기로 했다. 모바일 앱, 웹 모두 구현이 가능하고 장점이 많더라.

결론

하루종일 싸운 결과 안드로이드, iOS 모두 보내려면 이렇게 하면 된다. ~~한국인이 좋아하는 두괄식~~

index.js

const admin = require("firebase-admin");
let serviceAccount = require("firebase_key_경로"); 

admin.initializeApp({
    credential: admin.credential.cert(serviceAccount), 
});

푸시-알림-필요한-파일.js

const admin = require("firebase-admin");

...

let message = {
    notification: {
        title: '',
        body: ''
    },
    token: targetToken,
    android: {
        priority: "high"
    },
    apns: {
        payload: {
            aps: {
                contentAvailable: true,
            }
        }
    }
}

admin.messaging()
    .send(message)
    .then(function (response) {
        console.log('Successfully sent message: : ', response)
    })
    .catch(function (err) {
        console.log('Error Sending message!!! : ', err)
    })

첫 번째 문제

여러 파일에서 푸시 알림 사용

원래는 하나의 파일에서만 푸시 알림이 필요해서 모듈 부르고 앱 initialize하고 메시지 send까지 그 파일 안에서 모두 구현했다. 그런데 앱이 확장되며 여러 파일의 코드 안에서 푸시 알림을 보내야 했다.

여러 파일 모두 해당 코드를 복붙하면 앱 initialize를 여러번 하면 안 된다는 에러가 뜬다. 이건 당연하다. 내가 바보 ~

앱 initialize 코드를 index.js로 빼면 admin.messaging() is not a function이라는 에러가 뜬다. 여기서 시간을 많이 허비했는데, 다른 함수로도 바꿔보고 firebase-admin 모듈의 버전도 낮춰봤는데 안 됐다. 모듈 import를 안 해줘서 생긴 문제였다. 위 결론처럼 하면 된다.

두 번째 문제

iOS가 죽어도 안 됨

처음엔 아래와 같이 메시지를 구성했다. ~~초라해...~~

let message = {
    notification: {
        title: '',
        body: ''
    },
    token: targetToken
}

그런데 iOS는 앱이 꺼진 상태에서도 알림이 오도록 설정해야 하고, 우선순위를 높여줘야 하고, 앱의 bundle id도 넣어야 된다고 해서 아래처럼 바꿨다. ~~전쟁의 시작~~

let message = {
    notification: {
        title: '',
        body: ''
    },
    token: targetToken,
    // Set Android priority to "high"
    android: {
        priority: "high",
    },
    // Add APNS (Apple) config
    apns: {
        payload: {
        aps: {
            contentAvailable: true,
        },
    },
    headers: {
        "apns-push-type": "background",
        "apns-priority": "5", // Must be 5 when contentAvailable is set to true.
        "apns-topic": "io.flutter.plugins.firebase.messaging", // bundle identifier
    },
}

이렇게 안드로이드와 iOS 설정을 나눠주고, iOS 설정은 모두 apns에 넣었다. 사실 안드로이드는 처음부터 쭉 됐다. 근데 iOS는 이렇게 해도 안 됐다.

서버 단에서는 푸시 알림이 제대로 보내졌다고 success가 떴다. 근데 프론트에선 안 보이는 상황이고, 나는 무슨 문제인지 모르니까 내가 직접 테스트를 하면서 메시지 구성을 고쳐볼 수 없었다. 계속 보내고 팀원은 알림 안 뜬다고 얘기해주고 새로운 방법을 찾고 ... 했다.

새로운 방법은 공식 문서를 보면서 찾았는데, 진짜 공식 문서의 모든 페이지에서 메시지 구성이 달랐다. 뭘 믿으라는 겨;;

500번쯤 했을 때 다른 팀의 팀원분이 오셔서 아래처럼 aps 안에 alert를 넣어보라고 하셨다! 그리고 topic도 바꿔봤다.

let message = {
    notification: {
        title: '',
        body: ''
    },
    token: targetToken,
    // Set Android priority to "high"
    android: {
        priority: "high"
    },
    // Add APNS (Apple) config
    apns: {
        payload: {
            aps: {
                contentAvailable: true,
                alert: {
                    title: '',
                    body: ''
                }
            }
        },
        headers: {
            "apns-push-type": "background",
            "apns-priority": "5", // Must be 5 when contentAvailable is set to true.
            "apns-topic": "com.kakaobrain.pathfinder.ios.moilkIos" // bundle identifier
        }
	}
}

그래도 역시 ^^ 안 됐다. 그리고 iOS 팀원이 헤더랑 이것저것 다 빼보자고 했다.

이거 진짜 마지막 원트만 더 해보고 자렵니다

let message = {
    notification: {
        title: '',
        body: '지금 바로 참여해보세요!'
    },
    token: targetToken,
    android: {
        priority: "high"
    },
    apns: {
        payload: {
            aps: {
                contentAvailable: true,
            }
        }
    }
}

그렇게 둘다 엉엉 울면서 발 뻗고 잠들 수 있었다. ㅠㅠ 춘식팀 사랑해 역시 최고야 ❤️

오늘의 맛집

일산 라페스타 옆쪽에 있는 '라이크라이크'이다. 내가 드디어 일산 맛집을 쓰다니!!! 너무 기뻐!!!

브런치 카페이다. 브런치가 정말 맛있다. 음료보다 브런치가 더 맛있다. 저녁에 가도 브런치 세트는 하나 먹어야 한다.

애견카페는 아닌데 애견동반이 가능해서 호수공원 산책 때리고 쉬러 오는 망망이들이 많다. 우리 망망이도 호수공원 산책하고 처음 가봤는데 자리 앉아서 편하게 잘 쉬는 걸 보고 주기적으로 데려가기 시작했다. 그리고 직원분들이 친절하시다. 귀여운 망망이 물그릇도 챙겨주시고 처음 갔을 때는 간식도 주셨다. 울 망망이가 단백질 알레르기 때문에 비싼 가수분해 간식만 먹는데, 그날 펫츠런 참여해서 먹지도 못하는 일반 간식을 잔뜩 들고 있었다. 근데 이 카페에서 가수분해 간식을 주셨다. 거기서 완전 반해버려쓰 ㅜ