web-dev-qa-db-fra.com

Firebase Cloud Messaging avec l'application Ionic

Je développe une application Android/ios à l'aide d'un cadre ionique (technologies Web) et je souhaite ajouter la notification push à l'aide de la nouvelle fonctionnalité firebase FCM.

En ce moment, je regarde les docs suivants: 

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

ça dit:

  • Les sites Web de Chrome peuvent implémenter la messagerie Push par le biais d’intervenants et de
  • l’application suit le standard Webpush. Les applications et les extensions Chrome peuvent accéder au service FCM directement via chrome.gcm.
    API.

Cela signifie-t-il que je peux l'utiliser dans mon application ionique pour Android/iOS, étant donné que l'application est construite à l'aide de Cordova?

De plus, il sera très utile s'il y a un exemple mis en œuvre, je peux voir et apprendre de.

Merci

40

Je sais que cette question est déjà jurassique mais seulement pour l'information des futurs développeurs mobiles utilisant le framework Ionic. Cela fonctionne à 100% maintenant, je l'utilise depuis 3 semaines.

Tout ce dont vous avez besoin est d'ajouter ces 3 plugins

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

Ensuite, allez sur Console Firebase et

  • Créez un nouveau projet et donnez-lui un nom.
  • Sélectionnez la plate-forme que vous aimez (iOS/Android);
  • Ajoutez votre nom du paquet, qui est l'id de votreapp: vous pouvez le voir dans votre config.xml (quelque chose comme id = "com.ionicframework.someTest123").

La console Firebase vous donnera un fichier nommé google-services.json.

  • Collez-le dans le répertoire plateformes/Android/
  • Exécutez ionic build Android sur votre CLI

Vous pouvez maintenant aller à la page Notifications> Nouveau message

Assurez-vous de sélectionner l'application (identifiant de l'application) que vous avez ajoutée avant d'envoyer Push notifications.

49
JC Borlagdan

J'ai réussi à le faire fonctionner sur IOS. Voici ce que j'ai fait.

  1. Accédez à Firebase et ajoutez une nouvelle application IOS pour la messagerie en cloud . Suivez les instructions et remplissez le formulaire simple pour l'identifiant de votre application, etc. Vous allez générer le fichier GoogleServices-Info.plist et le télécharger. Ignorer les trucs de cocoapodes. Tu n'en as pas besoin.

  2. Accédez à votre plate-forme d'applications Ionic/ios et ouvrez le fichier xcodeproject avec XCode.

  3. Collez le fichier de plist GoogleServices téléchargé à la racine de votre fichier de projet Xcode.

  4. Courir. Ou vous pouvez essayer de sauvegarder puis faites ionic build ios, ionic emulate ios.

J'ai ajouté l'ancien phonegap-plugin-Push plus tôt. Cela devait être supprimé de mon fichier config.xml, sinon le IOS ne se construirait pas correctement.

8
Ben Looi

Vous pouvez utiliser FCM avec cordova sans problème, mais cela nécessite l'écriture de code natif pour Android, iOS et les autres plates-formes que vous souhaitez utiliser. Heureusement, la communauté de Cordova est assez grande et le travail est déjà fait. Le plugin suivant indique de faire exactement ce que vous voulez.

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

Je n'ai pas encore essayé le plugin moi-même, mais le fichier readme indique que vous pouvez vous abonner à des sujets en javascript et appeler la fonction onNotification pour écouter les notifications, pratique lorsque votre application est au premier plan.

5
Tim Baas

La prise en charge de JS/browser par FCM repose sur les API de notification du navigateur, dont Cordova n’a pas, à mon avis, une qui fonctionnera de manière native. Vous pouvez et devriez utiliser FCM pour toutes les plates-formes, mais vous devrez travailler en ajoutant manuellement la prise en charge de chaque plate-forme ou en attendant le développement du plug-in Push.

Le plug-in phonegap Push est en cours de mise à jour pour prendre en charge FCM: Migration vers Firebase Cloud Messaging # 929

Sinon, vous pouvez déjà utiliser l'ancienne plate-forme GCM avec le plug-in phonegap, mais vous voudrez mettre à jour votre API Push côté serveur pour utiliser FCM dès que le plug-in est prêt.

3
CuriouslyCory

Vous pouvez vérifier ceci: fonctionne pour iOS et Android https://github.com/mail2lulu/cordova-plugin-fcm.git

1
Satya