Node.js Kullanarak “Facebook Beğenileri” Nasıl Görüntülenir / Güncellenir?

Önceki yazıdaki örnek kodları çalıştırarak, Node.js. kullanmanın asıl faydasının ne olduğunu hissedebilirsiniz. Bugünün yayınında, Node.js'in olaya dayalı programlamada kullanımını açıkça gösteren pratik bir senaryo yazıyoruz..

Belirli bir Facebook sayfasının "Facebook beğenileri" sayısını veren basit bir komut dosyası oluşturacağız. Ve bunun da ötesinde, her 2 saniyede bir "Facebook beğenileri" sayısını güncelleyecek ek bir özellik atacağız.

Çıktı basit ve sade, muhtemelen şöyle bir şeye benzeyecek: "Beğenme Sayısı: 2630405" ve CSS kullanarak stillendirmek size kalmış, sonra başlayalım!

Sana bir fikir vermek için

Node.js'yi kullanmaya başlamadan önce, normal sunucu tarafı programlama dilleriyle (PHP gibi) normalde ne yapacağımızı düşünelim. Sayısını bulmak için bir AJAX araması yapmayı düşünüyorsanız seviyor 2 saniyede bir - haklısın - ama bu sunucu ek yükünü potansiyel olarak artırma.

Düşünebiliriz erişme graph.facebook.com hangisi olurdu zaman alan G / Ç işlemi. Aynı sayfaya erişen 5 kullanıcıyı göz önünde bulundurun ( seviyor). Erişim sayısı graph.facebook.com 2 saniye içinde 10 olacak, çünkü herkes onun sayısını güncelleyecektir. seviyor 2 saniyede bir ayrı bir konu olarak yürütülecek.

Node.js sunucu uygulaması için bu gerekli değildir. Sadece Facebook sunucusuna bir erişim gerekli ve sonucu alma ve verme zamanı (sayısı seviyor) büyük ölçüde azaltılabilir.

Ancak bunu nasıl uygulayacağız? Aşağıdaki bölümlerde bulacağımız şey budur..

Başlamak

Başlamadan önce, senin Node.js yüklü ve v8 ortam destekli bir web barındırma hesabında çalışıyorsa. Önceki makalemizdeki "Node.js ile Başlarken" ve "Node.js'i Kurma", Node.js için Başlangıç ​​Kılavuzu'ndaki konuları inceleyin..

Sunucuda biz erişim graph.facebook.com 2 saniyelik bir aralıkta ve sayısını güncelle seviyor. Hadi buna "diyelim"action1". Bir sayfa hazırlayacağız, böylece kendisini her 2 saniyede bir AJAX ile güncelleyecek.

Aynı sayfaya erişen birçok kullanıcı düşünün. Her kullanıcının AJAX talebi için "ACTION1" ın tamamlanması için sunucuya bir olay dinleyicisi eklidir. Böylece “EYLEM1” tamamlandığında olay dinleyicileri tetiklenir.

Sunucu tarafı koduna bir göz atalım.

Kodları:

 var facebook_client = my_http.createClient (80, "graph.facebook.com"); var facebook_emitter = yeni olaylar.EventEmitter (); işlevi get_data () var request = facebook_client.request ("GET", "/ 19292868552", "ana bilgisayar": "graph.facebook.com"); request.addListener ("yanıt", işlev (yanıt) var body = ""; yanıt.addListener ("veri", işlev (veri) vücut + = veri;); response.addListener ("son", işlev ( ) var data = JSON.parse (body); facebook_emitter.emit ("data", String (data.likes)););); request.end ();  my_http.createServer (işlev (istek, yanıt) var my_path = url.parse (request.url) .pathname; if (my_path === "/ getdata") var listener = facebook_emitter.once ("data", function (data) response.writeHeader (200, "Content-Type": "text / plain"); response.write (data); response.end ();); else load_file (my_path, response) ;) Dinle (8080); setInterval (get_data, 1000); sys.puts ("8080'de Çalışan Sunucu"); 

Kodları açıklama:

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

Biz oluştururuz HTTP istemcisi Facebook Graph API'sine erişmek için facebook_client. Ayrıca EventEmitter () "ACTION1" tamamlandığında tetiklenecek fonksiyon.

Bu aşağıda açıklanan kodda anlaşılacaktır..

 işlevi get_data () var request = facebook_client.request ("GET", "/ 19292868552", "ana bilgisayar": "graph.facebook.com"); request.addListener ("yanıt", işlev (yanıt) var body = ""; yanıt.addListener ("veri", işlev (veri) vücut + = veri;); response.addListener ("son", işlev ( ) var data = JSON.parse (body); facebook_emitter.emit ("data", String (data.likes)););); request.end ();  

fonksiyon get_data Facebook API Çağrısı'ndan veri alır. Önce biz GET isteği oluştur kullanmak istek aşağıdaki sözdiziminin yöntemi:

 Client.request (,  "ana": "host_url" 'GET_URL' 'GET'); 

Numara “19292868552” ayrıntılarına erişmemiz gereken sayfanın Facebook kimliğidir. Böylece erişmeye çalıştığımız son sayfa şu olur: http://graph.facebook.com/19292868552. Talepte bulunduktan sonra, ona üç dinleyici ekle, sırasıyla:

1. Tepki - Bu dinleyici, istek veri almaya başladığında tetiklenir. Burada boş bir dizeye verilen cevabın gövdesini belirledik.
2. Veri - Node.js eşzamansız olduğundan, veriler topak olarak alınır. Bu veri, vücut oluşturmak için vücut değişkenine eklenir.
3. Son - Bu dinleyici, yukarıda belirtilen "EYLEM1" tamamlandığında tetiklenir. Facebook Graph API çağrısı tarafından döndürülen veriler, verileri JSON biçiminde döndürür. Bu yüzden JavaScript işlevini kullanarak dizgiyi JSON dizisine dönüştürüyoruz. JSON.parse.

İçin bir dinleyicinin takılı olduğunu görebilirsiniz. event_emitter nesne. Biz "EYLEM1" sonunda tetiklemeniz gerekir. Dinleyiciyi açıkça yöntemle tetikliyoruz facebook_emitter.emit.

 "id": "19292868552", "ad": "Facebook Platformu", "fotoğraf": "http://profile.ak.fbcdn.net/hprofile-ak-ash2/211033_192928685555_7506301_s.jpg", "link": "https://www.facebook.com/platform", "seviyor": 2738595, "kategori": "Ürün / hizmet", "web sitesi": "http://developers.facebook.com", "kullanıcı adı": "platform", "kuruldu": "Mayıs 2007", "company_overview": "Facebook Platformu, herkesin Facebook ve web üzerinde sosyal uygulamalar oluşturmasını sağlar.", "misyon": "Web'i daha açık ve sosyal yapmak", "park yeri": "sokak": 0, "lot": 0, "vale": 0,

Yukarıdaki, Facebook Graph API çağrısının cevabını gösterir. Sayısını almak için seviyor: data nesnesinin likes nesnesini almak, dizeye dönüştür ve geçmek yaymak fonksiyon.

Bu eylemden sonra biz son talep.

 my_http.createServer (işlev (istek, yanıt) var my_path = url.parse (request.url) .pathname; if (my_path === "/ getdata") var listener = facebook_emitter.once ("data", function (işlev data) response.writeHeader (200, "Content-Type": "text / plain"); response.write (data); response.end ();); else load_file (my_path, response); ) Dinle (8080); setInterval (get_data, 1000); 

Sunucuyu oluşturmak önceki eğitime benzer - küçük bir değişiklikle. Her URL için (hariç / GetData) Biz kullanarak ilgili statik dosyayı yükleyin. dosya yükle fonksiyon daha önce tanımladık.

http: // localhost: 8080 / GetData AJAX isteğinin URL'si. Her AJAX isteğinde biz olay dinleyicisi eklemek facebook_emitter. Benzer addListener ama dinleyici hafıza sızıntısını önlemek için dinleyici yayınlandıktan sonra öldürülür.. Sadece kontrol etmeniz gerekiyorsa yerine bir Zamanlar ile addListener. Biz de diyoruz get_data işlev tarafından 1 saniyede bir kez işlev setInterval.

Ardından, çıktının görüntülendiği HTML sayfasını oluştururuz.

Kodları:

         
Beğenilerin Sayısı: Yükleniyor… 
    

Kodları açıklama:

JQuery AJAX kısmı oldukça açıklayıcıdır. Aramasını kontrol edin load_content işlevi. Öyle görünüyor sonsuz bir döngü çalışıyor, ve evet öyle. Bu sayının sayısı seviyor kendisi güncellenir.

Her AJAX araması ortalama 1 saniye gecikecek Bu çağrıların tetiklenmesindeki gecikme sunucudan 1 saniye olacaktır. AJAX talebi bu 1 saniye için eksik bir formda olacak.

Öyleyse işte - Facebook numarasını almak için sunucudan bir AJAX yanıtını geciktirme yöntemi seviyor. Herhangi bir şüpheniz veya düşünceniz varsa yorum bölümüne sorunuzu yazın, teşekkürler!

Editörün Notu: Bu gönderi tarafından yazılmıştır Geo Paul Hongkiat.com için. Geo, PHP, Codeigniter, WordPress, jQuery ve Ajax ile çalışmaktan hoşlanan bağımsız bir Web / iPhone geliştiricisidir. PHP'de 4 yıllık deneyime ve iPhone uygulama geliştirme alanında 2 yıllık deneyime sahiptir..