Categories
Utveckling

Hur man aktiverar push-meddelande med Meteor JS

Under de senaste månaderna har vi varit upptagna med att utveckla vår egen revolutionerande produkt. Mitt team och jag bestämde oss för att gå med Meteor på detta eftersom avsikten är att utveckla en multiplattformsapplikation med realtidsuppdateringar som en nyckelfaktor. Tillsammans med Meteor valde vi att gå med React JS för mallen med Meteor för reaktivitet av data. Att arbeta med Meteor har varit en fantastisk upplevelse hittills, men då och då hamnade vi på en vägspärr eftersom det finns mycket begränsad dokumentation om några av funktionerna – Push Notification var en gång ett sådant fall. Vi fick lägga mycket arbetstimmar på att dechiffrera problemet och få det att fungera ordentligt.

Så, på den här bloggen med titeln “Hur man aktiverar push-meddelanden med Meteor JS, kommer jag att dela några viktiga detaljer om hur du kan få push-meddelandet att fungera med Meteor JS-plattformen. Låt oss börja!

Det första steget mot att implementera push-aviseringsfunktionen på Meteor JS är att få projektnumret och API-nyckeln från Firebase-portalen.

Använd följande steg för att få den nödvändiga informationen:

1. Öppna Firebase Utvecklarkonsol.

2. Klicka på ‘skapa projekt’ och ge det ett passande projektnamn.

3. När det är gjort kommer du att kunna se Firebase-översiktssidan. Klicka nu på länken ‘Projektinställning’ som finns uppe till vänster (en del av svävningsinställningarna).

4. Klicka nu på fliken “Cloud Messaging”.

5. Skriv ner ditt avsändar-ID (det ska vara alla siffror) och din servernyckel (har stora och små bokstäver, siffror, understreck och bindestreck).

How To Enable Push Notification Using MeteorJS

Låt oss nu komma in på kodningsdelen

Vi har använt “raix/push” för push-meddelandefunktionen. Det första steget är naturligtvis att installera det. Installationsprocessen är som följer:

meteor add raix:push

meteor add cordova:cordova-plugin-device@1.1.5

meteor add cordova:phonegap-plugin-push@1.5.2 Lägg

nu till Push.Configure som en del av klienten inuti Meteor Startup () block av main.js

Push.Configure({

   android: {

     senderID: xxxxxxxxxx,

     alert: true,

     badge: true,

     sound: true,

     vibrate: true,

     clearNotifications: true

     // icon: ”,

     // iconColor: ”

  },

  ios: {

  alert: true,

  badge: true,

  sound: true

  }

});

How To Enable Push Notification Using MeteorJS

Dessutom måste du inkludera mobile-config.js också:

   App.configurePlugin(‘phonegap-plugin-push’, {

        SENDER_ID: xxxxxxxxxxxxx

    });

How To Enable Push Notification Using MeteorJS

När den här delen är klar lägger du till Push.Configure till servern i Meteor.startup()-blocket i main.js

Push.Configure({

        gcm: {

        projectNumber: xxxxxxxxxxx,

        apiKey: ‘xxxxxxxxxxx’

        }

    });

How To Enable Push Notification Using MeteorJS
Försök nu att skicka push-meddelandet:

Följande kod måste inkluderas för att push-meddelandet ska fungera effektivt:

Push.send({

        from: ‘push’,

        title: ‘Push Notification’,

        text: ‘Push Notification text’,

        badge: 1, //valfritt, använd den för att ställa in märkesantalet för mottagaren när appen är i bakgrunden.

        query: {

        // T.ex. skicka till en specifik användare om du använder konton:

            userId: ‘xxxxxxxxxx’

        } // Fråga appCollection

        / / token: appId eller token t.ex. “{ apn: token }”

        // tokens: array of appId’s eller tokens

        // payload: user data

        // delayUntil: Date

    });

 

Vi har slutfört kodningsdelen och nu kan vi testa push-meddelandet. Push-aviseringsfunktionen fungerar bara på mobila enheter, så anslut din Android-telefon (för att få push-aviseringar som fungerar på ios se detta länk) och mata in följande kommando i terminalen:

Meteor kör Android-enhet

Det är allt, din push-aviseringsfunktion bör börja fungera. Hör gärna av dig till mig på Twitter om du stöter på problem. Dela också dina tankar i kommentarsfältet. Glad kodning!!

By wdmaster_user

Webdura technologies is a full spectrum technology company in India with over 10 years of experience in developing technological solutions using ​JavaScript (ES6+), React JS, React Native, Redux, Rematch, Vue JS, Graph QL, Apollo, Meteor JS, Node JS, Gatsby JS, PHP, Wordpress, MySQL, Mongo DB and other latest tools. Webdura technologies have joined hands with many international and national giants to put forth cutting edge applications in this past decade.

Leave a Reply

Your email address will not be published. Required fields are marked *