nodejs로 Azure(애저) 클라우드 알림 허브 푸시알림 보내기

알림 허브

애저가 한국에서 많은 사람들이 사용하는 인기있는 서비스가 아니라, 뭔가 하나 하려면 생각보다 많은 공을 들여야 했다. 일단 내가 삽질을 헀으니, 다음 사람은 삽질하질 않길 바라는 마음으로 자주 Azure(애저)와 관련된 글을 올리려 한다. MS를 좋아하지 않았지만, 최근 행보와 서비스가 참 마음에 들었다. 특히 아마존 그 언저리되는 수준의 애저 서비스는 상당히 인상 깊었다. 그래서 최근 내가 운영하는 스타트업 Haffle은 슈퍼레디라는 서비스를 만들며 이 애저를 이용하기로 했다. 슈퍼레디 특성상 꼭 필요했던 서비스가 바로 푸시 알림이다. 이것을 구현하기는 어렵지 않겠지만, 다수의 사용자가 어떻게 알림을 구독하는지를 제어하고 이를 한 사용자의 다수의 각기 다른 디바이스에 알림을 골고루 뿌리는 일이 꽤 번거롭게 생각됐다. 아니, 본질인 서비스를 만드는 것 보다 오히려 여기에 상당한 시간을 들여야 한다 생각이 들었다.

그러다 알게된 서비스가 바로 애저의 알림허브다. 알림 허브는 다양한 플랫폼에서 지원되는 푸시 알림 인프라 서비스로, tag를 이용해 마치 검색하듯 알림을 손쉽게 보낼 수 있다. 빠르고 저렴하며, 우리가 제작하는 것 보다 안정적이라는 점이 상당히 마음에 들었다. 애저를 이용해 알림 인프라를 구축하는 비용보다 저렴하면서도 필요한 모든 기능이 제공됐다.

어찌됐든 쓰기로하고 나서 막상 개발하려니 막막했는데, 문서화가 잘 되어있지 않은 점 때문이었다. 당연하게도 C#쪽 문서는 완벽했지만 nodejs쪽은 불친절한 API 문서 외에는 거의 뭐 설명서가 제대로 없었다. 공식 사이트에선 찾을 수 없어서 이리저리 뒤져봤는데 원하는 만큼의 딱 들어맞는 예시는 찾을 수 없었다. 생각보다 구글에서 영어로 찾아도 잘 안찾아지는? 그래서 내가 쓴다.

뭔가 멋지게 설명하고 싶은데, 어차피 예제 코드만 볼 것 같아, 코드만 쫙 보여주는 식으로 쓰겠다. 안드로이드와 아이폰만 우리가 필요해서 두개의 코드만 있는데, 원래는 엄청 다양한 플랫폼을 지원한다.

먼저,

당연히 애저에 가입하고, 관리 포털을 접속하여 알림허브 서비스를 구성해야한다. 서비스 버스 메뉴에서 알림허브를 만들 수 있다.

그리고 나면 npm으로 azure 패키지를 설치한다.

sudo npm install azure

이후, 서브라임 텍스트 같은 편집기를 켜서 작업을 시작한다. 첫 줄에 먼저 모듈을 로드한다.

var azure = require('azure');

그리고 알림 허브와 연결을 하고, 명령을 처리해줄 객체를 만들어야한다.

var notificationHubService = azure.createNotificationHubService('hubname','connectionstring');

저기서 파라매터로 들어가는 hubname과 connectionstring은 Azure 관리 포털에서 알 수 있다.
hubname은 서비스 허브에서 구성할 때 입력한 이름이고, connectionstring은 알림 허브 대시보드 어딘가에 보이는 연결 문자열 보기를 클릭하면 알 수 있다. 그 긴 연결 문자열을 복붙하면 된다.

태그란?

잠깐 알아야할 게 있다. 애저는 태그를 사용해 푸시 알림의 스코프를 관리한다. 모든 사용자에게 브로드캐스트 할 수도 있지만, 어떨 때는 딱 한 명한태만 하고 싶을 때도 있다. 예를들어 나는 아이폰과 아이패드, 그리고 안드로이드 폰 세개를 쓰는데, 내게 와야할 알림이 아이패드만 오거나 아이폰에만 오면 안되고 3개의 디바이스 모두에 와야하지 않겠는가. 이럴때 tag를 youngkyu라고 쓰고, youngkyu란 태그에 푸시를 쏘면 모든 youngkyu의 디바이스에 푸시 알림이 도착한다.

서비스 버스 알림 허브에 시그니처와 API 키 등록

알림 허브에 구성을 클릭하면 APNS와 GCM의 시그니처와 키를 등록하는 곳이 있다. 여기에 해당 파일과 키를 올려줘야 애저에서 처리할 수 있는 환경이 조성된다.

디바이스 등록하기

먼저 디바이스를 등록해야한다. 이때 youngkyu로 예시를 들었던 tag도 설정한다. 잘 추상화되어있어서, 푸시알림의 과정을 정확히 이해하지 못해도 원활히 사용할 수 있다. 이 과정에 대한 얘기는 다음에 포스팅하겠다.

아이폰

먼저 아이폰의 deviceToken이 필요하다. 이건 애저와 관련이 없으므로 여기서 설명하지 않는다.

notificationHubService.apns
    .createNativeRegistration(deviceToken,tags,null,function(error){
    // To do
});

여기서 파라매터에 deviceToken은 받아온 토큰을 집어넣고, tags에는 배열에 담은 태그들을 집어넣는다. 세번째 null은 option으로 중요하지 않다. 제대로 설명도 안되있어서 아직 기능이 크게는 없는 듯 하다. 마지막 callback에 이후 할 작업 함수를 넣는다.

아래는 내가 쓴 코드 일부다.

notificationHubService.gcm
    .createNativeRegistration(deviceToken,["user","user."+userId],null,function(error){
    if(!error) {

    }
});

태그에 ["user","user."+userId]가 보이는가. 이렇게 적게되면 이후 "user"라는 태그에 푸시를 때리면 모든 "user"태그를 가진 디바이스가 받게 된다. 그리고 "user.12"라고 하면 12번 유저 아이디의 사용자만 받게 되는 식이다.

안드로이드

마찬가지로 deviceToken인 gcmRegistrationId가 먼저 필요하다.

notificationHubService.gcm
    .createNativeRegistration(gcmRegistrationId,tags,null,function(error){
    // To do
});

위와 똑같다. gcm만 빼고.

푸시 보내기

등록이 끝나고 나면, 아래 코드를 실행해본다.

var payload = {
    alert : "hello noti!",
    sound : "default"
}
notificationHubService.apns.send(null,payload,function(error){});

띵똥. 푸시가 왔는가? payload에 sound가 소리를 내는 역할을 하고, alert이 글을 표현한다. 그리고 send()의 첫번째 인자는 tag인데, null이면 브로드캐스트다. 모든 등록된 아이폰/IOS 디바이스에 전송한다. 따라서 받게 되는 것이다.

var payload = {
    alert : "hello users!",
    sound : "default"
}
notificationHubService.apns.send("user",payload,function(error){});

위와 같이 보내면 user태그를 가진 디바이스만 받게 된다. 만약 태그를 여러개 지정하고 싶다면, 아래와 같은 규칙을 쓰면 된다.

• 여러 태그들에 : “user.12||user.23||user.24”
• 두 태그 다 가지고 있는 : “user||post.15”

간단하다.

끝!

아주 간단하지만 많이 당황스러웠다. 섬세히 알려주는 튜토리얼 하나 없이 고작 API문서 딸랑 하나보고 시작했으니. 어쨌든 쉽다. 그리고 매우 강력하다. 푸시 시스템을 직접 만들면 더 저렴했을지 모르지만 (실은 그렇지도 않을 거다) 기회 비용이 상당히 높게된다. 서비스를 만드는 회사니 서비스에 집중해야하는데 말이다. API 문서는 아래 주소를 눌러 볼 수 있다. 다음 포스트에서는 초기에 설정한 tag이외의 tag들을 추가해보자.

http://dl.windowsazure.com/nodedocs/NotificationHubService.html