Kanaler fra Pusher er en plattform som gjør det enkelt å legge til sømløs sanntidsdata i appene dine. I denne videoen vil jeg vise deg hvordan du begynner å kode sanntids kommunikasjon mellom klient- og serverprogrammer med JavaScript og kanaler fra Pusher.
Det første du må gjøre er å opprette en konto på https://www.pusher.com. Klikk på Melde deg på knappen, og velg hvordan du vil logge på kontoen din. Du kan bruke GitHub eller Google-kontoen din, eller du kan bruke en e-postadresse og et passord. Gå videre og logg inn etter at du har opprettet kontoen din.
Første gang du logger på, blir du bedt om å opprette en ny kanal. Kanaler gir et standardnavn for søknaden din, men det er mer fornuftig å nevne kanalprogrammet noe som ligner på søknaden din. Fordi vi skal skrive en Node.js konsoll søknad, vil jeg ringe programmet mitt node-konsoll-app. Legg merke til at navngivningskonvensjonen er å bruke bindestrek i stedet for mellomrom.
Deretter må du velge klyngen din, og du vil velge hva som er nærmest din server fordi klienter kan være hvor som helst rundt om i verden. For meg er det en kaste opp mellom Ohio og North Virginia. Jeg valgte Ohio fordi det ble valgt som standard.
Deretter får du velge teknologiene du vil bruke til å skrive appen din. Jeg valgte Node.js, men gjerne bruke hvilken teknologi du vil.
Etter å ha klikket på Opprett min app knappen, du vil se Starter side. Denne siden er en klient, og merk at den sier at tilkoblingstilstanden er tilkoblet. Hvis vi ser på Oversikt siden ser vi at det er en klient. Det er denne demoklienten på Komme i gang-siden.
Nederst på oversiktssiden finner du app-ID, nøkkel, hemmelig nøkkel og klyngen. Dette er informasjonen du trenger for å koble til kanalprogrammet ditt fra klient- og serverprogrammer.
I en ny katalog, opprett en package.json fil med følgende kommando:
npm initieres
Du vil da installere Pusher-pakken.
npm installer pusher - save
Deretter oppretter du en fil som heter server.js-dette er vår søknadsfil. Skriv inn følgende kode:
'bruk streng'; const Pusher = krever ('pusher'); var pusher = ny Pusher (appId: '530620', nøkkel: 'b534d4fac76717b9872e', hemmelig: 'f84f62e45f82cc09b8c8', klynge: 'us2', kryptert: true);
Denne koden oppretter en Pusher
objekt ved å sende et objekt som har egenskaper for app-ID, nøkkelen, den hemmelige nøkkelen og klyngen til konstruktøren - i utgangspunktet all informasjonen vi nettopp så på oversiktensiden kommer til å være her. Det er også en annen eiendom som kalles kryptert
som angir at Pusher burde kryptere kommunikasjonen mellom serverprogrammet og kanalene.
Vårt enkle serverprogram vil akseptere brukerinngang ved å la oss skrive inn i konsollvinduet. Vi tar den innspillingen og utløser en meldingshendelse. Den koden ser slik ut:
process.stdin.on ('data', (chunk) => const str = chunk.toString (). trim (); hvis (str === 'exit') process.exit (0); pusher. utløser ('my-channel', 'my-event', melding: str);); console.log ('Skriv inn en melding ...');
I denne koden bruker vi standardinngangsstrømmen og lytter etter datahendelsen. Dataene vi mottar er rå data, så konverterer vi den til en streng og trimmer hvite plass. Vi sjekker deretter for å se om brukeren skrev ordet "exit", og i så fall forlater vi programmet.
Vi bruker deretter Pusher
objektets avtrekker()
metode for å utløse my-event
hendelse i min kanal
kanal. Så utløse en hendelse involverer følgende tre deler av informasjonen i rekkefølge:
Det er viktig å merke seg at kanalnavnet ikke er navnet på Kanal-appen. Snarere er det et vilkårlig navn som forhåpentligvis har noen form for betydning for vår søknad. Vi brukte standard, min kanal
, fordi det er hva demonstrasjonsklienten påKomme i gang-siden abonnerer på. Klienter som abonnerer på denne kanalen kan deretter lytte etter hendelser som forekommer i min kanal
kanal. I dette tilfellet må de lytte etter my-event
hendelse, fordi det er det vi utløser når vi skriver inn noe i Node.js-programmets konsoll.
Budskapets nyttelast kan være et objekt av enhver form. Nok en gang setter denne koden en meldingseiendom fordi det er det som Komme i gang-klienten ser etter.
Vi avsluttet vår appkode ved å skrive ut en melding som forteller brukeren at programmet er klart.
Du kan umiddelbart teste serverprogrammet ditt fordi vi allerede har en klient: Komme i gang-siden. Du kan kjøre serveren med følgende kommando:
node server.js
Meldinger du skriver inn i konsollappen, skal vises i en varslingsboks på siden Komme i gang. Vær så snill å leke med det før vi fortsetter å skrive klientens app i neste avsnitt.
Initialiser klientprosjektet i en annen katalog med følgende kommando:
npm initieres
Deretter installerer du klientens Pusher-bibliotek med følgende kommando:
npm installere pusher-js - save
Opprett en fil som heter client.js og skriv inn følgende kode:
'bruk streng'; const Pusher = krever ('pusher-js'); la pusher = ny Pusher ('b534d4fac76717b9872e', cluster: 'us2', kryptert: true); la kanal = pusher.subscribe ('my-channel'); channel.bind ('my-event', (data) => console.log (data.message);); console.log ('Lytt etter meldinger ...');
Denne koden oppretter en klient Pusher
gjenstand. Legg merke til at klientobjektet krever mindre informasjon enn serveren-Ikke ta med den hemmelige nøkkelen eller app-ID-en i klientkoden din! I vårt eksempel abonnerer vi da på min kanal
kanal ved hjelp av Pusher
objektets abonnere()
metode. Dette tillater deg å lytte etter noe arrangement i den kanalen.
Abonnere på en kanal gir deg et kanalobjekt som du kan bruke til å lytte etter hendelser som forekommer i den kanalen, og i denne koden brukte vi binde()
metode for å binde en lytter til my-event
begivenhet. Hver gang klienten håndterer my-event
hendelse, den bruker console.log ()
å skrive meldingen til skjermen.
Fortsett og kjør klienten i et eget konsollvindu, slik at du kan kjøre både klienten og serveren samtidig. Kommandoen for å kjøre appen er:
node client.js
Skriv inn meldinger i serverprogrammet, og du bør se at klienten mottar og sender dem ut.
Kanaler er en fantastisk plattform som gir deg muligheten til å legge til sanntidskommunikasjon i appene dine, og som du så fra de to programmene vi skrev i denne videoen, kan du legge til kraften i sanntidskommunikasjon relativt enkelt ved å bruke kanaler og deres biblioteker.