web-dev-qa-db-ja.com

Ionicアプリを使用したFirebase Cloudメッセージング

ionicフレームワーク(Webテクノロジー)を使用してAndroid/iosアプリを開発していますが、新しいFirebase機能FCMを使用してプッシュ通知を追加したいと思います。

今、私は次のドキュメントを見ています:

https://firebase.google.com/docs/cloud-messaging/chrome/client#project-setup

それは言う:

  • ChromeのWebサイトは、サービスワーカーとWebを介してプッシュメッセージングを実装できます。
  • webpush標準に準拠したアプリマニフェスト。 Chromeアプリと拡張機能は、chrome.gcmを介してFCMサービスに直接アクセスできます
    API。

アプリはCordovaを使用して構築されているため、Android/iosの両方のionicアプリで使用できますか?

また、実装された例があれば非常に役立ちます。私はそれを見て学ぶことができます。

ありがとう

40

私はこの質問がすでにジュラ紀的であることを知っていますが、Ionicフレームワークを使用する将来のモバイル開発者の情報のためだけです。これは現在100%動作しており、過去3週間使用しています。

必要なのは、これらの3つのプラグインを追加することです

⁠⁠⁠ionic plugin add cordova-plugin-inappbrowser
ionic plugin add cordova-plugin-fcm
ionic plugin add cordova-plugin-velda-devicefeedback

次に、 Firebase Console に移動します

  • 新しいプロジェクトを作成して名前を付けます。
  • 好みのプラットフォーム(ios/Android)を選択します。
  • パッケージ名を追加します。これはアプリのidです:config.xmlid = "com.ionicframework.someTest123"など).

Firebase Consoleはgoogle-services.jsonという名前のファイルを提供します。

  • platforms/Android /ディレクトリに貼り付けます
  • CLIでionic build Androidを実行します

これで、[通知]ページ> [新しいメッセージ]に移動できます

プッシュ通知を送信する前に、追加したアプリ(アプリのID)を選択してください。

50
JC Borlagdan

私はそれをIOSで動作させることができました。これが私がしたことです。

  1. Firebaseに移動し、クラウドメッセージング用の新しいIOSアプリを追加します。指示に従って、アプリIDなどの簡単なフォームに記入します。GoogleServices-Info.plistファイルを生成してダウンロードします。ココアポッドのものは無視してください。必要ありません。

  2. Ionicアプリプラットフォーム/ iosに移動し、XCodeでxcodeprojectファイルを開きます。

  3. ダウンロードしたGoogleServices plistファイルをXcodeプロジェクトファイルのルートに貼り付けます。

  4. 走るまたは、保存してからionic build iosionic emulate iosを実行できます。

以前に古いphonegap-plugin-Pushを追加しました。これをconfig.xmlから削除する必要があります。そうしないと、IOSが正常にビルドされません。

8
Ben Looi

問題なくCordovaでFCMを使用できますが、使用するAndroid、iOS、およびその他のプラットフォーム用のネイティブコードを記述する必要があります。幸い、コルドバのコミュニティはかなり大きく、作業はすでに完了しています。以下のプラグインは、まさにあなたが望むことをするように述べています。

https://www.npmjs.com/package/cordova-plugin-fcm

プラグインはまだ試していませんが、readmeには、javascriptからトピックをサブスクライブし、onNotification関数を呼び出して通知をリッスンでき、アプリがフォアグラウンドにあるときに便利です。

5
Tim Baas

JS /ブラウザーのFCMサポートは、ブラウザーの通知APIに依存していますが、その中にはCordovaがネイティブに動作するものがあるとは思いません。すべてのプラットフォームでFCMを使用できますが、各プラットフォームのサポートを手動で追加するか、プッシュプラグインの開発を待つ必要があります。

Phonegap Pushプラグインは、FCMをサポートするように更新されています: Migrate to Firebase Cloud Messaging#929

あるいは、古いGCMプラットフォームとphonegapプラグインをすでに使用できますが、プラグインの準備ができたらすぐにFCMを使用するようにサーバー側のプッシュAPIを更新する必要があります。

3
CuriouslyCory

これを確認できます:iOSおよびAndroidで動作します https://github.com/mail2lulu/cordova-plugin-fcm.git

1
Satya