콘솔로 이동

백그라운드 앱으로 첫 번째 메시지 보내기

FCM을 시작하기 위해 특정 사용자의 기기에서 앱이 백그라운드 상태일 때 해당 기기에 알림 메시지를 보내는 가장 단순한 사용 사례부터 살펴 보겠습니다. 이 페이지에서는 설정에서 검증까지 이 작업을 수행하는 모든 단계를 제시하므로, FCM용 자바스크립트 클라이언트 앱 설정을 마친 경우 일부 단계는 이미 완료된 상태일 수 있습니다.

SDK 설정

아직 추가하지 않았다면 자바스크립트 프로젝트에 Firebase를 추가합니다.

알림 수신 권한 요청

사용자가 앱 권한을 부여하여 브라우저에서 알림을 수신할 수 있도록 Web Notifications APINotification.requestPermission() 메소드가 동의 대화상자를 표시합니다. 권한이 거부되면 FCM 등록 토큰 요청 시 오류가 발생합니다.

Notification.requestPermission().then(function(permission) {
  if (permission === 'granted') {
    console.log('Notification permission granted.');
    // TODO(developer): Retrieve an Instance ID token for use with FCM.
    // ...
  } else {
    console.log('Unable to get permission to notify.');
  }
});

등록 토큰 액세스

이 섹션에서는 앱 인스턴스의 등록 토큰을 검색하고 토큰 갱신 이벤트를 모니터링하는 방법을 설명합니다. 토큰을 처음 사용한 후에 토큰이 회전될 수 있으므로 토큰 갱신을 모니터링하면서 항상 최신 상태로 업데이트된 등록 토큰을 검색해야 합니다.

다음과 같은 경우에 등록 토큰이 변경될 수 있습니다.

  • 웹 앱이 등록 토큰을 삭제할 때
  • 사용자가 브라우저 데이터를 소거할 때. 이 경우 getToken을 호출하여 새 토큰을 검색하세요.

현재 등록 토큰 검색

현재 토큰을 검색하려면 getToken을 호출하세요. 권한이 부여되지 않았다면 이 메소드는 null을 반환합니다. 그렇지 않은 경우 토큰을 반환하거나 오류가 있으면 프라미스를 거부합니다.

메시징 서비스에 firebase-messaging-sw.js 파일이 필요합니다. firebase-messaging-sw.js 파일이 아직 없다면 토큰을 검색하기 전에 이 이름으로 빈 파일을 만들어 도메인의 루트에 저장합니다. 나중에 클라이언트 설정 프로세스에서 중요한 내용을 추가할 수 있습니다.

다음과 같이 현재 토큰을 검색할 수 있습니다.

// Get Instance ID token. Initially this makes a network call, once retrieved
// subsequent calls to getToken will return from cache.
messaging.getToken().then(function(currentToken) {
  if (currentToken) {
    sendTokenToServer(currentToken);
    updateUIForPushEnabled(currentToken);
  } else {
    // Show permission request.
    console.log('No Instance ID token available. Request permission to generate one.');
    // Show permission UI.
    updateUIForPushPermissionRequired();
    setTokenSentToServer(false);
  }
}).catch(function(err) {
  console.log('An error occurred while retrieving token. ', err);
  showToken('Error retrieving Instance ID token. ', err);
  setTokenSentToServer(false);
});

토큰 갱신 모니터링

토큰이 새로 생성될 때마다 onTokenRefresh 콜백이 실행되므로 이 콜백의 컨텍스트에서 getToken을 호출하면 사용 가능한 현재 등록 토큰에 항상 액세스하게 됩니다.

// Callback fired if Instance ID token is updated.
messaging.onTokenRefresh(function() {
  messaging.getToken().then(function(refreshedToken) {
    console.log('Token refreshed.');
    // Indicate that the new Instance ID token has not yet been sent to the
    // app server.
    setTokenSentToServer(false);
    // Send Instance ID token to app server.
    sendTokenToServer(refreshedToken);
    // ...
  }).catch(function(err) {
    console.log('Unable to retrieve refreshed token ', err);
    showToken('Unable to retrieve refreshed token ', err);
  });
});

토큰이 확보되었으면 앱 서버로 전송하고 원하는 방법으로 저장하세요. Instance ID server API를 사용하여 구독 관련 정보를 가져올 수 있습니다.

알림 메시지 전송

특정 기기 1개에 메시지를 보내려면 아래와 같이 기기의 등록 토큰을 전달합니다. 등록 토큰에 대한 자세한 내용은 플랫폼별 클라이언트 설정 정보를 참조하세요.

Node.js

// This registration token comes from the client FCM SDKs.
var registrationToken = 'YOUR_REGISTRATION_TOKEN';

var message = {
  data: {
    score: '850',
    time: '2:45'
  },
  token: registrationToken
};

// Send a message to the device corresponding to the provided
// registration token.
admin.messaging().send(message)
  .then((response) => {
    // Response is a message ID string.
    console.log('Successfully sent message:', response);
  })
  .catch((error) => {
    console.log('Error sending message:', error);
  });

자바

// This registration token comes from the client FCM SDKs.
String registrationToken = "YOUR_REGISTRATION_TOKEN";

// See documentation on defining a message payload.
Message message = Message.builder()
    .putData("score", "850")
    .putData("time", "2:45")
    .setToken(registrationToken)
    .build();

// Send a message to the device corresponding to the provided
// registration token.
String response = FirebaseMessaging.getInstance().send(message);
// Response is a message ID string.
System.out.println("Successfully sent message: " + response);

Python

# This registration token comes from the client FCM SDKs.
registration_token = 'YOUR_REGISTRATION_TOKEN'

# See documentation on defining a message payload.
message = messaging.Message(
    data={
        'score': '850',
        'time': '2:45',
    },
    token=registration_token,
)

# Send a message to the device corresponding to the provided
# registration token.
response = messaging.send(message)
# Response is a message ID string.
print('Successfully sent message:', response)

Go

// Obtain a messaging.Client from the App.
ctx := context.Background()
client, err := app.Messaging(ctx)
if err != nil {
	log.Fatalf("error getting Messaging client: %v\n", err)
}

// This registration token comes from the client FCM SDKs.
registrationToken := "YOUR_REGISTRATION_TOKEN"

// See documentation on defining a message payload.
message := &messaging.Message{
	Data: map[string]string{
		"score": "850",
		"time":  "2:45",
	},
	Token: registrationToken,
}

// Send a message to the device corresponding to the provided
// registration token.
response, err := client.Send(ctx, message)
if err != nil {
	log.Fatalln(err)
}
// Response is a message ID string.
fmt.Println("Successfully sent message:", response)

C#

// This registration token comes from the client FCM SDKs.
var registrationToken = "YOUR_REGISTRATION_TOKEN";

// See documentation on defining a message payload.
var message = new Message()
{
    Data = new Dictionary<string, string>()
    {
        { "score", "850" },
        { "time", "2:45" },
    },
    Token = registrationToken,
};

// Send a message to the device corresponding to the provided
// registration token.
string response = await FirebaseMessaging.DefaultInstance.SendAsync(message);
// Response is a message ID string.
Console.WriteLine("Successfully sent message: " + response);

REST

POST https://fcm.googleapis.com/v1/projects/myproject-b5ae1/messages:send HTTP/1.1

Content-Type: application/json
Authorization: Bearer ya29.ElqKBGN2Ri_Uz...HnS_uNreA

{
  "message":{
    "token" : "bk3RNwTe3H0:CI2k_HHwgIpoDKCIZvvDMExUdFQ3P1...",
    "notification" : {
      "body" : "This is an FCM notification message!",
      "title" : "FCM Message",
      }
   }
}

cURL 명령어:

curl -X POST -H "Authorization: Bearer ya29.ElqKBGN2Ri_Uz...HnS_uNreA" -H "Content-Type: application/json" -d '{
"message":{
  "notification": {
    "title": "FCM Message",
    "body": "This is an FCM Message",
  },
  "token": "bk3RNwTe3H0:CI2k_HHwgIpoDKCIZvvDMExUdFQ3P1..."
  }
}' https://fcm.googleapis.com/v1/projects/myproject-b5ae1/messages:send

성공하면 각 전송 메소드가 메시지 ID를 반환하고, Firebase Admin SDK가 projects/{project_id}/messages/{message_id} 형식으로 ID 문자열을 반환합니다. HTTP 프로토콜 응답은 단일 JSON 키입니다.

    {
      "name": "projects/myproject-b5ae1/messages/0:1500415314455276%31bd1c9631bd1c96"
    }

알림 페이로드에 웹 푸시 속성 추가

HTTP v1 API를 사용하면 Web Notification API의 유효한 속성이 포함된 JSON 객체로 추가 알림 옵션을 지정할 수 있습니다. 이 객체에 titlebody 필드가 있으면 해당 google.firebase.fcm.v1.Notification.titlegoogle.firebase.fcm.v1.Notification.body 필드를 재정의합니다.

HTTP POST 요청

POST https://fcm.googleapis.com/v1/projects/myproject-b5ae1/messages:send HTTP/1.1

Content-Type: application/json
Authorization: Bearer ya29.ElqKBGN2Ri_Uz...PbJ_uNasm

{
  "message": {
    "token" : <token of destination app>,
    "notification": {
      "title": "FCM Message",
      "body": "This is a message from FCM"
    },
    "webpush": {
      "headers": {
        "Urgency": "high"
      },
      "notification": {
        "body": "This is a message from FCM to web",
        "requireInteraction": "true",
        "badge": "/badge-icon.png"
      }
    }
  }
}

이 요청을 사용하면 타겟팅하는 웹 클라이언트(Android에서 실행되는 지원 브라우저 포함)에서 사용자가 상호작용할 때까지 활성 상태로 유지되는 우선순위가 높은 알림 메시지를 수신합니다. 메시지에 다음 필드가 포함됩니다.

  • title: FCM 메시지
  • body: FCM에서 웹으로 보내는 메시지
  • requireInteraction: true
  • badge: /badge-icon.png

웹 재정의가 적용되지 않는 Android 및 iOS 네이티브 앱에서는 다음 필드가 포함된 보통 우선순위 알림 메시지를 수신합니다.

  • title: FCM 메시지
  • body: FCM에서 보내는 메시지

현재 RequireInteraction은 일부 브라우저에서만 지원된다는 점에 유의하세요. 개발자가 Web Notification API 사양을 통해 지원되는 플랫폼과 브라우저를 확인해야 합니다.

cURL

curl -X POST -H "Authorization: Bearer ya29.ElqKBGN2Ri_Uz...PbJ_uNasm" -H "Content-Type: application/json" -d '{
  "message": {
    "notification": {
      "title": "FCM Message",
      "body": "This is a message from FCM"
    },
    "webpush": {
      "headers": {
        "Urgency": "high"
      },
      "notification": {
        "body": "This is a message from FCM to web",
        "requireInteraction": "true",
        "badge": "/badge-icon.png"
      }
    }
  },
  "token": "bk3RNwTe3H0:CI2k_HHwgIpoDKCIZvvDMExUdFQ3P1..."
  }
}' "https://fcm.googleapis.com/v1/projects/myproject-b5ae1/messages:send"

HTTP 응답

{
    "name": "projects/myproject-b5ae1/messages/0:1500415314455276%31bd1c9631bd1c98"
}

FCM 메시지에 대한 자세한 내용은 앱 서버 보내기 요청 작성을 참조하세요.

다음 단계

포그라운드 앱에 메시지 전송

백그라운드 앱에 알림 메시지를 보내는 데 성공했으면 자바스크립트 클라이언트에서 메시지 수신을 참조하여 포그라운드 앱에 전송하는 방법을 알아보세요.

알림 메시지 이외의 고급 기능

앱에 단순한 알림 메시지 이외에 더 많은 고급 기능을 추가하려면 다음을 참조하세요.