Como exibir / atualizar “curtidas no Facebook” usando o Node.js

Trabalhando com os códigos de amostra do post anterior, você pode ter a sensação de qual é o benefício real de usar o Node.js. No post de hoje, lançamos um script prático que demonstra claramente o uso do Node.js na programação baseada em eventos.

Nós estaremos criando um script simples que gera o número de "curtidas do Facebook" de uma página do Facebook em particular. E, além disso, adicionaremos um recurso adicional que atualizará o número de "curtidas do Facebook" a cada 2 segundos.

A saída será simples e simples, provavelmente é algo como: "Número de curtidas: 2630405" e cabe a você estilizá-lo usando o CSS, vamos começar então!

Para lhe dar uma ideia

Antes de nos aprofundarmos no uso do Node.js, vamos pensar um pouco no que normalmente faríamos com linguagens de programação comuns do lado do servidor (como o PHP). Se você está pensando em fazer uma chamada AJAX para encontrar o número de gostos em cada 2 segundos - você está correto - mas isso pode potencialmente aumentar a sobrecarga do servidor.

Nós podemos considerar acessando graph.facebook.com o que seria um operação de E / S demorada. Considere 5 usuários acessando a mesma página (que gera o número de gostos). O número de acesso a graph.facebook.com em 2 segundos vai se tornar 10, porque todo mundo vai atualizar o seu número de gostos uma vez em 2 segundos e será executado como um segmento separado.

Isso não é necessário com uma implementação do servidor Node.js. Somente um acesso ao servidor do Facebook é necessário e a tempo para obter e produzir o resultado (número de gostos) pode ser bastante reduzido.

No entanto, como vamos implementar isso? Isso é o que vamos descobrir nas seções abaixo.

Começando

Antes de começarmos, você deve ter o Node.js instalado e em execução em uma conta de hospedagem na web suportada pelo ambiente v8. Confira os tópicos "Introdução ao Node.js" e "Instalando o Node.js" em nosso artigo anterior, Beginner's Guide to Node.js se você não tiver.

No servidor nós Acesso graph.facebook.com em um intervalo de 2 segundos e atualizar o número de gostos. Vamos chamar isso de "ACTION1". Vamos preparar uma página para que ela se atualize via AJAX a cada 2 segundos.

Considere muitos usuários acessando a mesma página. Para cada solicitação AJAX do usuário, um ouvinte de evento é anexado ao servidor para a conclusão de "ACTION1". Assim, sempre que a "ACTION1" for concluída, os ouvintes do evento serão acionados.

Vamos dar uma olhada no código do lado do servidor.

Os códigos:

 var facebook_client = my_http.createClient (80, "graph.facebook.com"); var facebook_emitter = novos eventos.EventEmitter (); função get_data () var request = facebook_client.request ("GET", "/ 19292868552", "host": "graph.facebook.com"); request.addListener ("resposta", função (resposta) var body = ""; response.addListener ("dados", função (dados) corpo + = dados;); response.addListener ("fim", função ( ) var data = JSON.parse (corpo); facebook_emitter.emit ("data", String (data.likes)););); request.end ();  my_http.createServer (function (request, response) var minha_path = url.parse (request.url) .pathname; if (minha_chave === "/ getdata") var listener = facebook_emitter.once ("dados", função (data) response.writeHeader (200, "Content-Type": "texto / sem formatação"); response.write (data); response.end ();); else load_file (my_path, response) ;). listen (8080); setInterval (get_data, 1000); sys.puts ("Servidor em execução em 8080"); 

Explicação dos códigos:

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

Nós criamos um Cliente HTTP para acessar a API do Graph do Facebook facebook_client. Nós também precisamos do EventEmitter () função que irá disparar quando o "ACTION1" tiver terminado.

Isso ficará claro no código descrito abaixo.

 função get_data () var request = facebook_client.request ("GET", "/ 19292868552", "host": "graph.facebook.com"); request.addListener ("resposta", função (resposta) var body = ""; response.addListener ("dados", função (dados) corpo + = dados;); response.addListener ("fim", função ( ) var data = JSON.parse (corpo); facebook_emitter.emit ("data", String (data.likes)););); request.end ();  

Função adquirir dados obtém dados da chamada da API do Facebook. Nós primeiro criar uma solicitação GET usando o pedido método da seguinte sintaxe:

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

O número “19292868552” é o ID do Facebook da página que precisamos acessar seus detalhes. Então a última página que estamos tentando acessar se torna: http://graph.facebook.com/19292868552. Depois de fazer o pedido, precisamos adicione três ouvintes a ele, respectivamente o seguinte:

1. Resposta - Este ouvinte é acionado quando a solicitação começa a receber dados. Aqui nós configuramos o corpo da resposta para uma string vazia.
2. Dados - Como o Node.js é assíncrono, os dados são recebidos em partes. Estes dados são adicionados à variável corporal para construir o corpo.
3. Fim - Este ouvinte é acionado quando o "ACTION1" especificado acima é concluído. Os dados retornados pela chamada da API do Graph do Facebook retornam dados no formato JSON. Então nós convertemos a string para o array JSON usando a função JavaScript JSON.parse.

Você pode ver que um ouvinte está conectado para o event_emitter objeto. Nós precisa acioná-lo no final da "ACTION1". Nós acionamos o ouvinte explicitamente com o método facebook_emitter.emit.

 "id": "19292868552", "name": "Plataforma Facebook", "imagem": "http://profile.ak.fbcdn.net/hprofile-ak-ash2/211033_19292868552_7506301_s.jpg", "link": "https://www.facebook.com/platform", "gosta": 2738595, "categoria": "Produto / serviço", "website": "http://developers.facebook.com", "username": "platform", "founded": "Maio de 2007", "company_overview": "Plataforma Facebook permite que qualquer pessoa crie aplicativos sociais no Facebook e na Web.", "missão": "Tornar a Web mais aberta e social." "parking": "street": 0, "lote": 0, "manobrista": 0,

O acima representa a resposta da chamada da API do Graph do Facebook. Para obter o número de gostos: pegue o objeto "gostei" do objeto de dados, convertê-lo em string e passe para emitir função.

Depois desta ação nós fim o pedido.

 my_http.createServer (function (request, response) var minha_path = url.parse (request.url) .pathname; if (minha_palavra === "/ getdata") var listener = facebook_emitter.once ("dados", função ( data) response.writeHeader (200, "Content-Type": "texto / sem formatação"); response.write (data); response.end ();); else load_file (my_path, response); ). listen (8080); setInterval (get_data, 1000); 

Criar o servidor é semelhante ao tutorial anterior - com uma pequena alteração. Para cada URL (exceto /adquirir dados) nós carregar o arquivo estático correspondente usando o load_file função nós definimos anteriormente.

o http: // localhost: 8080 / getdata é o URL para o pedido AJAX. Em cada pedido AJAX nós anexar um ouvinte de evento a facebook_emitter. É semelhante ao addListener mas o ouvinte é morto depois que o ouvinte é emitido para evitar um vazamento de memória. Se você precisa conferir substitua o uma vez com addListener. Nós também chamamos o adquirir dados função uma vez em 1 segundo pela função setInterval.

Em seguida, criamos a página HTML onde a saída é exibida.

Os códigos:

         
Número de curtidas: Carregando… 
    

Explicação dos códigos:

A parte do jQuery AJAX é bastante auto-explicativa. Confira a chamada do load_content função. Parece que está executando um loop infinito, e sim é. É assim que o número de gostos se atualiza.

Cada chamada AJAX será atrasado pelo tempo médio de 1 segundo como o atraso no disparo de cada chamada será de 1 segundo do servidor. O pedido AJAX estará em uma forma incompleta para esse segundo.

Então lá vai você - um método de atrasar uma resposta AJAX do servidor para obter o número de Facebook gostos. Solte a questão em nossa seção de comentários, se você tiver alguma dúvida ou pensamento, obrigado!

Nota do editor: Este post foi escrito por Geo Paul para Hongkiat.com. Geo é um desenvolvedor Web / iPhone independente que gosta de trabalhar com PHP, Codeigniter, WordPress, jQuery e Ajax. Ele tem 4 anos de experiência em PHP e 2 anos de experiência em desenvolvimento de aplicativos para iPhone..