前回に続いてカンファレンスアプリを作っていくチュートリアルです。アプリができあがった暁には実際にリリースしますのでお楽しみに!
今回はアプリと言えばプッシュ通知、ということでプッシュ通知を組み込んでみます。
Monaca × NCMBのプッシュ通知はとても簡単
MonacaアプリにNCMBのプッシュ通知を組み込むのはとても簡単です。管理画面でCordovaプラグインとして組み込みます。これは無料ユーザでも利用できます。
実装について
アプリを起動した時にいきなりプッシュ通知を許可して欲しいというダイアログが出ても、誰も許可してくれないでしょう。カンファレンスアプリとして参考にしたApple製のWWDCアプリでは、アプリの説明画面にボタンが配置されていました。
このボタンを押すとはじめてプッシュ通知の確認が出るという仕組みです。ユーザにとって納得感のあるUXとなっています。
今回はこの実装を真似しています。
ボタンを押してプッシュ通知のダイアログを出すのはとても簡単です。アプリからはなるべくNCMBを直接触らず、ラッピングしたクラスを介して操作するようになっています。こうすることでデータ操作部分をまとめて管理できるようになります。
getToken() { this.ncmb .getToken() .then(() => { // Change status }, err => { alert(err); }) }
getTokenは以下のように window.NCMB.monaca.setDeviceToken
を実行しています。これだけでデバイストークンをNCMBに登録してくれます。
getToken() { return new Promise((res, rej) => { window.NCMB.monaca.setDeviceToken( config.applicationKey, config.clientKey, config.senderId, success => res(), err => rej(err) ) }); }
ステータスを確認する
次に問題なのは通知の状態を確認する方法です。多くのアプリでは通知をオフにする方法が明確になっていません。その結果、通知が多いとアプリを削除されてしまいます。WWDCアプリでは通知を受け取る設定になっていると、設定画面の通知設定に飛べるようになります。
このためには cordova-plugin-push-notifications-status
というプラグインを使います。このプラグインを使うとプッシュ通知設定のステータスが取れます。
PushNotificationsStatus.getStatus(status => { // status が authorizedであれば許可済み // status が denied であれば拒否 })
このようにすることでプッシュ通知が許可されているかどうか分かるようになります。以下は試しにステータスをアラートしたところです。
まとめ
プッシュ通知はユーザのアクティビティを上げる大事な施策ですが、あまり連発したりするとアプリの削除につながってしまう可能性があります。ユーザ自身、多数の通知を受け取っており、ムダに受信したいとは思わなくなっています。そのため、あまり押しつけるようなことはせず、ユーザが登録したくなるような利便性とさりげなさが大事ではないでしょうか。
このアプリのコードはgoofmint/DevRelConAppにアップロードしてあります。実装時の参考にしてください。