Hoe Facebook Likes wordt weergegeven / bijgewerkt met Node.js

Door de voorbeeldcodes uit de vorige post uit te werken, hebt u mogelijk het gevoel dat het werkelijke voordeel van het gebruik van Node.js. In de post van vandaag gooien we een praktisch script in dat duidelijk het gebruik van Node.js in event-based programmeren laat zien.

We zullen een eenvoudig script maken dat het aantal "Facebook-likes" van een bepaalde Facebook-pagina weergeeft. En bovendien voegen we een extra functie toe die het aantal "likes op Facebook" elke 2 seconden zal bijwerken.

De uitvoer is eenvoudig en duidelijk, waarschijnlijk ziet het er ongeveer zo uit: "Number Likes: 2630405" en het is aan jou om het te stylen met behulp van de CSS, laten we aan de slag gaan!

Om je een idee te geven

Voordat we een duik nemen in het gebruik van Node.js, laten we even nadenken over wat we normaal zouden doen met algemene programmeertalen aan de serverkant (zoals PHP). Als u erover denkt om een ​​AJAX-oproep te doen om het aantal te vinden sympathieën in elke 2 seconden - je hebt gelijk - maar dit kan mogelijk de serveroverhead verhogen.

We kunnen overwegen toegang graph.facebook.com dat zou een zijn tijdrovende I / O-bewerking. Overweeg 5 gebruikers die dezelfde pagina gebruiken (die het aantal uitvoert) sympathieën). Het aantal toegangen tot graph.facebook.com in 2 seconden wordt 10, omdat iedereen zijn / haar aantal zal bijwerken sympathieën eenmaal in 2 seconden en het wordt als een afzonderlijke thread uitgevoerd.

Dat is niet nodig met een Node.js-serverimplementatie. Enkel en alleen een toegang tot de Facebook-server is vereist en de tijd om het resultaat te krijgen en uit te voeren (aantal sympathieën) kan sterk worden verminderd.

Hoe gaan we dit echter implementeren? Dat is wat we gaan ontdekken in de onderstaande secties.

Ermee beginnen

Voordat we beginnen, zou je dat moeten doen hebben Node.js geïnstalleerd en uitgevoerd op een door V8 omgeving ondersteund webhostingaccount. Bekijk de onderwerpen "Aan de slag met Node.js" en "Node.js installeren" in ons vorige artikel, Beginnershandleiding voor Node.js als je dat nog niet hebt gedaan.

In de server wij toegang graph.facebook.com met een interval van 2 seconden en update het aantal sympathieën. Laten we dit noemen als "Action1". We zullen een pagina voorbereiden zodat deze elke 2 seconden via AJAX wordt bijgewerkt.

Overweeg dat veel gebruikers dezelfde pagina openen. Voor elke AJAX-aanvraag van een gebruiker is een gebeurtenislistener op de server bevestigd voor de voltooiing van "ACTION1". Dus wanneer de "ACTION1" is voltooid, worden de gebeurtenislisteners geactiveerd.

Laten we eens kijken naar de code aan de serverzijde.

De codes:

 var facebook_client = my_http.createClient (80, "graph.facebook.com"); var facebook_emitter = nieuwe events.EventEmitter (); functie get_data () var request = facebook_client.request ("GET", "/ 19292868552", "host": "graph.facebook.com"); request.addListener ("response", functie (respons) var body = ""; response.addListener ("data", functie (gegevens) body + = data;); response.addListener ("end", function ( ) var data = JSON.parse (body); facebook_emitter.emit ("data", String (data.likes)););); request.end ();  my_http.createServer (functie (verzoek, antwoord) var my_path = url.parse (request.url) .pathname; if (my_path === "/ getdata") var listener = facebook_emitter.once ("data", functie (data) response.writeHeader (200, "Content-Type": "text / plain"); response.write (data); response.end ();); else load_file (my_path, response) ;). listen (8080); setInterval (get_data, 1000); sys.puts ("Server draait op 8080"); 

Codes Toelichting:

 var facebook_client = my_http.createClient (80, "graph.facebook.com"); var facebook_emitter = nieuwe events.EventEmitter (); 

We creëren een HTTP-client om toegang te krijgen tot Facebook Graph API's facebook_client. We hebben ook de EventEmitter () functie die wordt geactiveerd wanneer "ACTION1" is voltooid.

Dit wordt duidelijk in de hieronder beschreven code.

 functie get_data () var request = facebook_client.request ("GET", "/ 19292868552", "host": "graph.facebook.com"); request.addListener ("response", functie (respons) var body = ""; response.addListener ("data", functie (gegevens) body + = data;); response.addListener ("end", function ( ) var data = JSON.parse (body); facebook_emitter.emit ("data", String (data.likes)););); request.end ();  

Functie gegevens verkrijgen haalt gegevens op van de Facebook API-oproep. Wij eerst maak een GET-verzoek aan de ... gebruiken verzoek methode van de volgende syntaxis:

 Client.request ( 'GET', 'get_url',  "host": "host_url"); 

Het nummer “19292868552” is de Facebook-ID van de pagina die we nodig hebben om toegang te krijgen tot de details. Dus de laatste pagina die we proberen te openen wordt: http://graph.facebook.com/19292868552. Na het maken van het verzoek moeten we dat doen voeg er drie luisteraars aan toe, respectievelijk het volgende:

1. antwoord - Deze luisteraar wordt geactiveerd wanneer het verzoek begint met het ontvangen van gegevens. Hier stellen we de body van het antwoord in op een lege string.
2. Gegevens - Omdat Node.js asynchroon is, worden de gegevens als chunks ontvangen. Deze gegevens worden toegevoegd aan de hoofdvariabele om het lichaam op te bouwen.
3. Einde - Deze luisteraar wordt geactiveerd wanneer de hierboven beschreven "ACTION1" is voltooid. De gegevens die door de Facebook Graph API-aanroep worden geretourneerd, retourneren gegevens in JSON-indeling. Dus we converteren de string naar JSON-array met behulp van de JavaScript-functie JSON.parse.

Je kunt zien dat er een luisteraar is bijgevoegd voor de event_emitter voorwerp. Wij nodig om het te activeren aan het einde van de "ACTIE 1". We triggeren de luisteraar expliciet met de methode facebook_emitter.emit.

 "id": "19292868552", "name": "Facebook Platform", "picture": "http://profile.ak.fbcdn.net/hprofile-ak-ash2/211033_19292868552_7506301_s.jpg", "link": "https://www.facebook.com/platform", "likes": 2738595, "category": "Product / service", "website": "http://developers.facebook.com", "gebruikersnaam": "platform", "opgericht": "mei 2007", "company_overview": "Facebook Platform stelt iedereen in staat om sociale apps op Facebook en het web te bouwen.", "missie": "Het internet opener en socialer maken.", "parkeren": "straat": 0, "partij": 0, "bediende": 0,

Het bovenstaande vertegenwoordigt het antwoord van de Facebook Graph API-aanroep. Om het aantal te krijgen sympathieën: neem het vind-ik-leuk-object van het data-object, converteer het naar een string en geef het door aan uitzenden functie.

Na deze actie hebben we einde de aanvraag.

 my_http.createServer (functie (verzoek, antwoord) var my_path = url.parse (request.url) .pathname; if (my_path === "/ getdata") var listener = facebook_emitter.once ("data", functie ( data) response.writeHeader (200, "Content-Type": "text / plain"); response.write (data); response.end ();); else load_file (my_path, response); ). listen (8080); setInterval (get_data, 1000); 

Het maken van de server lijkt op de vorige zelfstudie - met een kleine wijziging. Voor elke URL (behalve /gegevens verkrijgen) wij laad het corresponderende statische bestand met behulp van de laad bestand functie we hebben eerder gedefinieerd.

De http: // localhost: 8080 / getData is de URL voor het AJAX-verzoek. In elke AJAX-aanvraag hebben we bevestig een gebeurtenislistener aan facebook_emitter. Het is vergelijkbaar met de addListener maar de luisteraar wordt gedood nadat de luisteraar is uitgestoten om een ​​geheugenlek te voorkomen. Als je het gewoon wilt bekijken vervang de een keer met addListener. We noemen ook de gegevens verkrijgen functioneer eenmaal in 1 seconde door de functie setInterval.

Vervolgens maken we de HTML-pagina waar de uitvoer wordt weergegeven.

De codes:

         
Aantal vind-ik-leuks: Bezig met laden… 
    

Codes Toelichting:

Het jQuery AJAX-deel is vrij duidelijk. Bekijk de call van de load_content functie. Het lijkt erop heeft een oneindige lus, en ja het is. Dat is hoe het aantal sympathieën wordt zelf bijgewerkt.

Elke AJAX-oproep wordt vertraagd met de gemiddelde tijd van 1 seconde omdat de vertraging bij het triggeren van elke oproep 1 seconde van de server komt. Het AJAX-verzoek zal gedurende 1 seconde onvolledig zijn.

Dus daar ga je - een methode om een ​​AJAX-reactie van de server te vertragen om het aantal Facebook te krijgen sympathieën. Zet vraag in onze commentaarsectie als u enige twijfel of gedachte hebt, bedankt!

Opmerking van de uitgever: Dit bericht is geschreven door Geo Paul voor Hongkiat.com. Geo is een onafhankelijke web- / iPhone-ontwikkelaar die graag werkt met PHP, Codeigniter, WordPress, jQuery en Ajax. Hij heeft 4 jaar ervaring in PHP en 2 jaar ervaring in de ontwikkeling van iPhone-applicaties.