Miten Facebook-tykkäyksiä näytetään / päivitetään Node.js n avulla
Työskentelemällä edellisen postin koodikoodit saatat tuntea, mikä on todellinen hyöty Node.js. Nykypäivän postissa me heitämme käytännön komentosarjan, joka osoittaa selvästi Node.js: n käytön tapahtumapohjaiseen ohjelmointiin.
Luomme yksinkertaisen komentosarjan, joka antaa tietyn Facebook-sivun "Facebook-tykkää" -määrän. Ja sen lisäksi me heitämme lisäominaisuuden, joka päivittää "Facebookin tykkää" -numeron 2 sekunnin välein.
Tulos on yksinkertainen ja selkeä, luultavasti näyttää jotain tältä: "Likes: 2630405" ja sinun on itse tyyliteltävä CSS: llä, aloitetaan sitten!
Anna sinulle idea
Ennen kuin me sukeltaa Node.js: n käyttöön, otamme hetki miettimään, mitä normaalisti teemme tavallisilla palvelinpuolen ohjelmointikielillä (kuten PHP). Jos ajattelet tehdä AJAX-puhelun löytääkseen numeron tykkää 2 sekunnin välein - olet oikeassa - mutta tämä voi mahdollisesti lisätä palvelimen yleiskustannuksia.
Voimme harkita saatavuuden graph.facebook.com joka olisi a aikaa vievä I / O-toiminto. Harkitse 5 käyttäjää, jotka käyttävät samaa sivua (joka tuottaa numeron tykkää). Käyttöoikeuksien määrä graph.facebook.com 2 sekunnissa tulee 10, koska jokainen päivittää numeronsa tykkää kerran 2 sekunnissa ja se suoritetaan erillisenä langana.
Se ei ole tarpeen Node.js-palvelimen toteutuksen yhteydessä. Vain tarvitaan yksi pääsy Facebook-palvelimeen ja aika saada ja tuottaa tulos (lukumäärä. \ t tykkää) voidaan vähentää huomattavasti.
Miten aiomme kuitenkin toteuttaa tämän? Sitä me selvitämme seuraavissa osioissa.
Päästä alkuun
Ennen kuin aloitamme, sinun pitäisi Node.js on asennettu ja se toimii v8-ympäristössä tuetulla web-hosting-tilillä. Tutustu aiheisiin "Aloittaminen Node.js: n kanssa" ja "Asenna Node.js" edellisessä artikkelissamme, Aloittelijan opas Node.jsiin, jos et ole.
Palvelimessa me pääsy graph.facebook.com
2 sekunnin välein ja päivitä tykkää. Kutsumme tätä nimellä "Toimi 1"Valmistamme sivun niin, että se päivittää itsensä AJAXin kautta joka toinen sekunti.
Harkitse monia käyttäjiä, jotka käyttävät samaa sivua. Jokaisen käyttäjän AJAX-pyynnön yhteydessä palvelimelle on liitetty tapahtuman kuuntelija "ACTION1": n loppuun saattamiseksi.. Joten kun "ACTION1" on valmis, tapahtuman kuuntelijat käynnistyvät.
Katsotaanpa palvelimen puolella olevaa koodia.
Koodit:
var facebook_client = my_http.createClient (80, "graph.facebook.com"); var facebook_emitter = uudet tapahtumat.EventEmitter (); toiminto get_data () var request = facebook_client.request ("GET", "/ 19292868552", "isäntä": "graph.facebook.com"); request.addListener ("vastaus", toiminto (vastaus) var body = ""; response.addListener ("data", toiminto (data) body + = data;); response.addListener ("loppu", toiminto ( ) var data = JSON.parse (body), facebook_emitter.emit ("data", merkkijono (data.likes)););); request.end (); my_http.createServer (toiminto (pyyntö, vastaus) var my_path = url.parse (request.url) .pathname; if (my_path === "/ getdata") var listener = facebook_emitter.once ("data", toiminto (data) response.writeHeader (200, "Sisältötyyppi": "text / plain"), vastausviesti (data), response.end ();) load_file (my_path, vastaus) ;) kuuntele (8080); setInterval (get_data, 1000); sys.puts ("Palvelimen käyttö 8080: ssa");
Koodit Selitys:
var facebook_client = my_http.createClient (80, "graph.facebook.com"); var facebook_emitter = uudet tapahtumat.EventEmitter ();
Luomme a HTTP-asiakas käyttää Facebook Graph API: tä facebook_client
. Tarvitsemme myös EventEmitter ()
toiminto, joka käynnistyy, kun "ACTION1" on valmis.
Tämä käy ilmi jäljempänä kuvatusta koodista.
toiminto get_data () var request = facebook_client.request ("GET", "/ 19292868552", "isäntä": "graph.facebook.com"); request.addListener ("vastaus", toiminto (vastaus) var body = ""; response.addListener ("data", toiminto (data) body + = data;); response.addListener ("loppu", toiminto ( ) var data = JSON.parse (body), facebook_emitter.emit ("data", merkkijono (data.likes)););); request.end ();
Toimia get_data
noutaa tiedot Facebook API -hausta. Me ensin luo GET-pyyntö käyttämällä pyyntö
seuraavan syntaksin menetelmä:
Client.request ( 'GET', 'GET_URL', "isäntä": "host_url");
Numero “19292868552” on sen sivun Facebook-tunnus, johon meidän on käytettävä tietoja. Siten viimeinen sivu, jota yritämme käyttää, tulee: http://graph.facebook.com/19292868552. Pyynnön tekemisen jälkeen meidän täytyy lisää kolme kuuntelijaa, vastaavasti:
- Vastaus - Tämä kuuntelija käynnistyy, kun pyyntö alkaa vastaanottaa dataa. Tässä asetamme vastauksen tyhjälle merkkijonolle.
- data - Koska Node.js on asynkroninen, data vastaanotetaan paloina. Nämä tiedot lisätään kehon muuttujaan kehon rakentamiseksi.
- pää - Tämä kuuntelija käynnistyy, kun edellä mainittu ACTION1 on valmis. Facebook Graph API -kutsun palauttamat tiedot palauttavat tiedot JSON-muodossa. Joten muunamme merkkijonon JSON-ryhmäksi JavaScript-toiminnolla
JSON.parse
.
Näet, että kuulija on liitetty event_emitter
esine. Me täytyy käynnistää se "ACTION1: n" lopussa. Käynnistämme kuuntelijan nimenomaan menetelmällä facebook_emitter.emit
.
"id": "19292868552", "nimi": "Facebook Platform", "kuva": "http://profile.ak.fbcdn.net/hprofile-ak-ash2/211033_19292868552_7506301_s.jpg", "linkki": "https://www.facebook.com/platform", "tykkää": 2738595, "luokka": "Tuote / palvelu", "verkkosivusto": "http://developers.facebook.com", "käyttäjätunnus": "foorumi", "perustettu": "Toukokuu 2007", "company_overview": "Facebook-foorumi antaa kaikille mahdollisuuden rakentaa sosiaalisia sovelluksia Facebookiin ja verkkoon.", "tehtävä": "Jotta Web olisi avoimempi ja sosiaalinen." "pysäköinti": "street": 0, "lot": 0, "valet": 0,
Edellä esitetty vastaa Facebook Graph API -soiton vastausta. Saadaksesi numeron tykkää: ota haluamasi objekti objektin objektista, muuntaa sen merkkijonoksi ja välitä se säteillä
toimia.
Tämän toimenpiteen jälkeen me pää
pyyntö.
my_http.createServer (toiminto (pyyntö, vastaus) var my_path = url.parse (request.url) .pathname; if (my_path === "/ getdata") var listener = facebook_emitter.once ("data", toiminto ( data) response.writeHeader (200, "Content-Type": "text / plain"), response.write (data), response.end ();); other load_file (my_path, vastaus); ). (8080); setInterval (get_data, 1000);
Palvelimen luominen on samanlainen kuin edellinen opetusohjelma - pienellä muutoksella. Jokaisesta URL-osoitteesta (paitsi / GetData
) me lataa vastaava staattinen tiedosto käyttäen load_file
toimia määritimme aiemmin.
http: // localhost: 8080 / GetData
on AJAX-pyynnön URL-osoite. Jokaisessa AJAX-pyynnössä me kiinnitä tapahtuman kuuntelija facebook_emitter
. Se on samanlainen kuin addListener
mutta kuuntelija tapetaan kuuntelijan lähettämisen jälkeen muistivuodon välttämiseksi. Jos sinun täytyy tarkistaa se vain korvata kerran
kanssa addListener
. Me kutsumme myös get_data
toiminto toimii kerran sekunnissa setInterval
.
Seuraavaksi luomme HTML-sivun, jossa tuloste näyttää.
Koodit:
Facebook Likes Tapahtumien lukumäärä: Ladataan…
Koodit Selitys:
JQuery AJAX -osa on melko itsestään selvä. Tutustu puheluun load_content
toimia. Se näyttää siltä on käynnissä ääretön silmukka, ja kyllä se on. Näin numero tykkää päivittää itsensä.
Jokainen AJAX-puhelu viivästyy keskimäärin 1 sekuntia koska kunkin tällaisen puhelun laukaisun viive on 1 sekunti palvelimelta. AJAX-pyyntö tulee olemaan epätäydellinen 1 sekunnin ajan.
Joten olet menossa - menetelmä viivästyttää AJAX-vastausta palvelimelta Facebook-numeron saamiseksi tykkää. Pudota kysymys kommenttiosastollamme, jos sinulla on epäilyksiä tai ajatuksia, kiitos!
Toimittajan huomautus: Tämä viesti on kirjoittanut Geo Paul varten Hongkiat.com. Geo on itsenäinen Web / iPhone-kehittäjä, joka nauttii työskentelystä PHP: n, Codeigniterin, WordPressin, jQueryn ja Ajaxin kanssa. Hänellä on 4 vuoden kokemus PHP: stä ja 2 vuoden kokemus iniPhone-sovellusten kehittämisestä.