コンソールへ移動

バックグラウンドで動作しているアプリに最初のメッセージを送信する

FCM の手始めとして、シンプルなユースケースを作成します。アプリがデバイスのバックグラウンドで動作しているときに、特定のユーザーのデバイスに通知メッセージを送信してみましょう。このページには、このチュートリアルに必要なセットアップから検証までのすべての手順が記載されています。JavaScript クライアント アプリでの FCM の設定がすでに済んでいる場合は、一部の手順を省略できます。

SDK を設定する

まだ追加していない場合は、Firebase を JavaScript プロジェクトに追加します

通知の受信許可を求める

Web Notifications API のメソッド Notification.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 を返します。そうでない場合は、トークンを返すか、エラーが原因で Promise を拒否します。

メッセージング サービスには 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);
  });
});

トークンを取得したら、それをアプリサーバーに送信して、適切な方法で保管します。インスタンス ID サーバー 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);
  });

Java

// 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

成功すると、各 send メソッドはメッセージ ID を返します。Firebase Admin SDK は projects/{project_id}/messages/{message_id} という形式で ID 文字列を返します。HTTP プロトコル レスポンスは単一の JSON キーです。

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

通知ペイロードに web push プロパティを追加する

HTTP v1 API を使用すると、Web Notification API の有効なプロパティを含む JSON オブジェクトとして、追加の通知オプションを指定できます。このオブジェクトの title フィールドと body フィールドが存在する場合、これらのフィールドは同等の google.firebase.fcm.v1.Notification.title フィールドや google.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 Message
  • Body: This is a message from FCM to web
  • RequireInteraction: true
  • Badge: /badge-icon.png

Android と iOS のネイティブ アプリ(ウェブのオーバーライドが適用されないアプリ)は、通常優先度の通知メッセージを受信します。このメッセージには次のフィールドが含まれます。

  • Title: FCM Message
  • Body: This is a message from 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 メッセージの詳細については、App Server の送信リクエストの作成を参照してください。

次のステップ

フォアグラウンドで動作しているアプリへのメッセージの送信

バックグラウンドで動作しているアプリに通知メッセージが正常に送信されたら、JavaScript クライアントでメッセージを受信するを参照して、フォアグラウンドで動作しているアプリへのメッセージの送信を試します。

通知メッセージ以外の動作

通知メッセージだけでなく、他のより高度な動作をアプリに追加する場合は、以下をご確認ください。