ソースコードの移行

Monacaプロジェクトの更新は、iOSとAndroidの両方で共通の手順を踏みます。

FirebaseXプラグインの導入: MonacaアプリでFirebaseを利用するため、FirebaseXプラグインをインストールします。
コードの更新: ニフクラ mobile backendを使用した既存のプッシュ通知コードをFirebase対応のコードに変換します。

FirebaseXプラグインの導入

Monaca IDEのヘッダーメニューの設定から corodvaプラグインの管理 を選択して、プラグイン画面を開きます
次に、ニフクラ mobile backendのプラグインがインストールされている場合は、アンインストールします
「[email protected]」をインストールします

コードの更新

ニフクラ mobile backendのプッシュ通知機能のコードをFirebaseXプラグインを利用したコードに更新していきます。

ニフクラ mobile backendを利用したコード

次のコードは、ニフクラ mobile backendを利用したプッシュ通知の基本的なコードです。このコードをもとにFirebaseXプラグインのコードに更新します。

まず、下のコードについて解説します。このコードでは、次の処理を行います。

デバイストークンの取得と登録: window.NCMB.monaca.setDeviceToken を使用して、デバイスに固有のトークンを取得し、アプリケーションのインストール情報としてNCMBサーバーへ登録します。
通知の許可を求める: ユーザーにプッシュ通知の許可を求めるポップアップを表示し、window.NCMB.monaca.grantPermissionを使用してユーザーの応答を取得します。
開封通知の設定: window.NCMB.monaca.setReceiptStatus(true)を使って、プッシュ通知が開封されたときにサーバーに通知する設定を行います。
プッシュ通知の受信時の処理: プッシュ通知を受信した際の処理を定義し、通知内容（JSONデータ）をアラートで表示します。

<script>
        document.addEventListener("deviceready", function() {
            // デバイストークンを取得してinstallation登録が行われます
            window.NCMB.monaca.setDeviceToken(
                "application_key",
                "client_key"
            );

            // 通知許可を求めるポップアップを表示
            window.NCMB.monaca.grantPermission(function(hasPermission) {
                alert("Notifications permission was " + (hasPermission ? "granted" : "denied"));
            });

            // 開封通知登録の設定
            window.NCMB.monaca.setReceiptStatus(true); // trueを設定すると、開封通知を行います

            // プッシュ通知受信時の処理
            window.NCMB.monaca.setHandler(
                function(jsonData) {// 送信時に指定したJSONが引数として渡されます
                    alert("callback :::" + JSON.stringify(jsonData));
                }
            );
        }, false);
</script>

FirebaseXプラグインを利用したコード

上のニフクラ mobile backendのコードは、Firebasexプラグインを利用した場合、次のようになります。処理の流れは以下の通りです：

プッシュ通知許可の確認: window.FirebasePlugin.hasPermissionを使って、ユーザーがプッシュ通知を受け取るための許可を与えているかどうかを確認します。
通知許可の要求: もしユーザーがまだ許可を与えていなければ、window.FirebasePlugin.grantPermissionを使って許可を求めるポップアップを表示します。
プッシュ通知受信時の処理: window.FirebasePlugin.onMessageReceivedを使って、プッシュ通知を受け取った時の動作を定義します。通知のタイプや、通知がタップされたかどうかに応じて、異なるアラートを表示します。

<script>
document.addEventListener("deviceready", async function () {
    // プッシュ通知許可の確認
    const hasPermission = await new Promise((resolve, reject) => {
        window.FirebasePlugin.hasPermission(resolve);
    });

    // 通知許可を求めるポップアップを表示
    if (!hasPermission) {
        await new Promise((resolve, reject) => {
            window.FirebasePlugin.grantPermission(resolve, reject);
        });
        alert("Permission is granted");
    } else {
        alert("Permission to receive notification is granted.");
    }

    // プッシュ通知受信時の処理
    window.FirebasePlugin.onMessageReceived(message => {
        alert("Message type: " + message.messageType);
        if (message.messageType === "notification") {
            alert("Notification message received");
            if (message.tap) {
                alert("Tapped in " + message.tap);
            }
        }
    }, error => {
        alert(error);
    });
}, false);
</script>

NCMBとFirebaseXプラグインのメソッド対応表

以下の表は、ニフクラ mobile backendのプッシュ通知プラグインの各メソッドとFirebaseXプラグインのメソッドの対応表です。

ニフクラ mobile backendからFirebaseXへの移行では、いくつかの重要な違いに注意が必要です。特に、window.NCMB.monaca.setDeviceTokenのようなメソッドはFirebaseXでは存在せず、Firebaseではデバイストークンが自動的に管理されます。

また、FirebaseXではAndroidとiOSのトークンを別々に扱い、getTokenとgetAPNSTokenメソッドを使用してそれぞれのトークンを取得します。

FirebaseXでのプッシュ通知の受信は、FirebasePlugin.onMessageReceivedで設定し、プッシュ通知の許可はFirebasePlugin.grantPermissionを使います。なお、FireabseXのAPIについて、より詳しい内容は、こちらをご確認ください。

メソッド (NCMB)

説明

メソッド (FirebaseX)

NCMB.monaca.setDeviceToken

データストア(Installationクラス)にdeviceTokenを登録します。

- FirebaseXでは、setDeviceTokenという機能はありません。デバイストークンはFirebaseコンソール側で自動的に管理されます。また、NCMBと異なり、Firebaseコンソールには、登録されたデバイストークンを確認するための画面は提供されていません。

NCMB.monaca.setHandler

アプリがプッシュ通知を受け取った際のコールバックを設定します。

FirebasePlugin.onMessageReceived

NCMB.monaca.getInstallationId

デバイスのinstallation objectIdを取得します。

NCMB.monaca.setReceiptStatus

プッシュ通知の開封状況をサーバーに登録する許可します。

NCMB.monaca.getReceiptStatus

プッシュ通知の開封状況を取得します。

NCMB.monaca.getDeviceToken

デバイスのInstallation deviceTokenを取得します。

NCMBでは、AndroidとiOSのトークン（デバイストークン）を同じように扱っていましたが、FirebaseXでは、次のようにAndroidとiOSのトークンを区別して扱います。

getToken(): Android用のトークン(FCMトークン)を取得します。 getAPNSToken(): iOS用のトークン(APNsトークン)を取得します。

NCMB.monaca.grantPermission

プッシュ通知の許可を付与します。

FirebasePlugin.grantPermission

用語の説明

デバイストークン

デバイストークンは、Android用のFCMトークンとiOS用のAPNsトークンを総称したものです。これらは、それぞれのデバイスでプッシュ通知を受け取るための一意の識別子です。

FCMトークン: Firebase Cloud Messagingが生成し、Androidデバイスでプッシュ通知を受信するために使用。
APNsトークン: Apple Push Notification serviceが生成し、iOSデバイスでプッシュ通知を受信するために使用。

これらのトークンは、サーバー側から特定のデバイスに対して通知を送る際に必要で、各デバイスがプラットフォームに対応した方法でトークンを取得し、アプリケーションサーバーに提供することで、個別のデバイスへ通知を配信できます。

前へFirebaseサービスの設定次へデータストア

最終更新 1 年前

役に立ちましたか？