--- title: Simple Push slug: WebAPI/Simple_Push translation_of: Archive/B2G_OS/API/Simple_Push_API ---

Simple Push API, 다른 이름으로 푸시 알림 API는 알림을 받으면 앱이 깨어나는 기능을 제공한다. 앱은 서버와 공유할 수 있는 URI를 요청할 수 있는데, 다시 말해 앱에 전달될 버전 번호를 보낼 수 있다는 뜻이다. 이 기능은 동기화 메카니즘으로 사용될 수도 있고, 서드 파티 서버에서 최신 데이터를 가져오기 위해 쓸 수도 있다.

심플푸시 API는 {{domxref("PushManager")}} 객체인 push 속성을 가지고 {{domxref("window.navigator")}} 객체를 확장하고, 푸시 상태를 감지하기 위해 받을 수 있는 새 이벤트를 더한다.

예제

이 예제는 푸시의 전체 설정을 다룬다. 다음 단계를 따라하자.

앱의 매니페스트 파일에 push를 허용하는 상태로 더한다.
endpoint를 요청하기 위해 push.register()를 호출한다.
endpoint를 서버에 보낸다.
앱 내부의 푸시 알림을 위한 메시지 핸들러를 더한다.
서버에서 알림을 보낸다..

매니페스트 파일 변경

매니페스트 파일에서 두 가지를 수정한다.

messages field - push와 push-register 메시지를 더한다.
permissions field - 푸시 알림을 받기 원하는 앱에 더한다.

"messages": [
   { "push": "/index.html"},
   { "push-register": "/index.html"}
],
"permissions": {
  "push": {
    "description": "Required for be updated with new goals in soccer matchs",
  }
}

endpoint 요청을 위한 {{domxref("PushManager.register")}} 호출

이 코드는 endpoint를 요청할 시간인지 결정할 때 호출해야 한다. 예를 들어 사용자가 로그인 할 때나 축구 경기를 관전하기 시작할 때를 들 수 있다.

if (navigator.push) {
  var req = navigator.push.register();

  req.onsuccess = function(e) {
    var endpoint = req.result;
      debug("New endpoint: " + endpoint );
    }

   req.onerror = function(e) {
     debug("Error getting a new endpoint: " + JSON.stringify(e));
   }
} else {
  // No push on the DOM
}

endpoint를 서버에 보내기

endpoint를 갖게 되면, 어플리케이션 서버에 보내야 한다. 한 가지 방법만 있는 건 아닌데, 선호하는 방법으로 할 수 있으므로, 예를 들어 이메일을 보내거나 POST, PUT이나 GET 방식을 사용할 수도 있다. 추천하는 방법은 어플리케이션에서 사용자 데이터와 함께 endpoint를 저장하는 방식으로, 쿠키, 사용자 이름같이 endpoint와 사용자 쌍을 식별하는데 사용할 수 있다면 무엇이든 좋다.

하지만 서버에 보낸다면, 다음의 좋은 사례를 따르기를 권한다.

XMLHttpRequest로 보낸다.
항상 HTTPS를 사용한다. 누군가 endpoint를 가로채면, 앱에 알림을 보낼 수 있다.
쿠키와 같이, endpoint에 사용자(또는 어플리케이션 설치)와 맞춰볼 수 있는 무언가를 사용한다.

메시지 핸들러 더하기

endpoint를 설정하면, 앱이 푸시 메시지를 들을 준비가 된다. index.html 파일이나 main.js 스크립트에 등록할 수 있는데, 스크립트만 있다면 특정 push-message.html 파일이 될 수도 있다. 이 방식은 push 메시지를 받고 앱이 종료하는 경우 유용한데,HTML/자바스크립트 코드의 작은 부분만 로드한 상태로 앱이 완전히 열릴지 혹은 백그라운드에서 어떤 작업을 할지 결정할 수 있기 때문이다.

if (window.navigator.mozSetMessageHandler) {
  window.navigator.mozSetMessageHandler('push', function(e) {
    debug('My endpoint is ' + e.pushEndpoint);
    debug('My new version is ' +  e.version);
    //Remember that you can handle here if you have more than
    //one pushEndpoint
    if (e.pushEndpoint === emailEndpoint) {
      emailHandler(e.version);
    } else if (e.pushEndpoint === imEndpoint) {
      imHandler(e.version);
    }
  });
} else {
  // No message handler
}

알림 보내기

서버에 endpoint를 가지면, 알림을 보내는 작업은 body에 version=<version>를 가지고 endpoint에 HTTP PUT 요청을 보내는 일만큼 쉽다. 다음과 같이 URL을 갖는 endpoint를 가정하자.

https://push.src.openwebdevice.com/v1/notify/abcdef01234567890abcdefabcdef01234567890abcdef

그리고 버전은 5이다.

version=5

컬로 다음 명령을 내리자.

curl -X PUT -d "version=5" https://push.src.openwebdevice.com/v1/notify/abcdef01234567890abcdefabcdef01234567890abcdef

서버가 올바르게 동작하면, 200 Status (OK)와 {}인 body를 응답으로 받게 된다. 그렇지 않으면, 오류를 설명하는 유효한 JSON 객체를 받게 된다.

버전은 정수이고 증가한다는 점을 기억하자. 어플리케이션은 새로운 버전이 서버나 단말기에 저장된 버전보다 낮으면 알림을 받지 않는다.

Specifications

Browser compatibility

{{page("/en-US/docs/Web/API/PushManager","Browser_compatibility")}}

예제