English|Português|Español
UsuárioSenhaLogin

INÍCIO
PALESTRAS
INFO
GeneXus Blog

Brincando com Facebook

Alejandro Cimas da Artech compartilha com a Comunidade três controles que resolvem a comunicação com o Facebook a partir de nossos objetos. Disponíveis na GXPlatform Gallery da Comunidade GeneXus.

 :: Alejandro Cimas ::

Faz um tempo que eu tinha vontade de poder integrar o Facebook com o GeneXus, de fato, na palestra que ministramos com Javier Larrosa na  XVIII GeneXus Meeting de 2008 já tínhamos apresentado alguma coisa. Naquela oportunidade foi feito através dos External Objects do GeneXus, utilizamos uma biblioteca desenvolvida por Microsoft para interagir com o Facebook. A ideia era boa, e a gente conseguiu se comunicar muito facilmente através daquela biblioteca.
O problema é que estávamos usando um produto de um terceiro, podendo fazê-lo diretamente através da API do Facebook. O inconveniente com isso é que sempre que esse terceiro mudasse, tínhamos que mudar o nosso External Object para atualizar a lista de métodos/propiedades.

Isso foi exatamente que aconteceu depois do evento, Microsoft mudou várias interfaces da mencionada biblioteca devido a mudanças na própria API do Facebook, e o que nós tínhamos funcionando e que, de fato, mostramos na Demo da palestra, parou de funcionar.
O interessante de utilizar um External Object era que tínhamos a API do Facebook encapsulada naquele objeto e era muito fácil de se utilizar.
Podíamos seguir na linha de utilizar uma biblioteca de um terceiro ou nós mesmos podíamos interagir com a API do Facebook sem necessidade de um terceiro, e essa é justamente a linha que escolhemos, desenvolver uma série do User Controls que resolvam a comunicação com o Facebook a partir dos nossos objetos.
Em qualquer caso, seja utilizando uma biblioteca de um terceiro ou acessando a API diretamente, temos que criar uma aplicação no Facebook; para isso, antes de mais nada devemos adicionar a nosso perfil do Facebook a application: Developer. E depois criar uma nova Application, isso nos permitirá obter uma ApiKey com a qual poderemos acessar a API. Aqui podem saber um pouco mais sobre o assunto.
A ideia dos User Controls é utilizar a JavaScript Client Library, para acessar a API através de código JavaScript. Não queremos hostear uma app no Facebook, portanto, quando criarmos nossa app em Developer só irá nos interessar:
Basic -  API Key, Key necessária para poder interagir com a API



Connect - Connect URL, url onde Facebook enviará uma sessão válida para nos comunicar com eles:



Como vocês podem ver, também configurei um valor para Base Domain, neste caso localhost. Isto, devido a que teremos uma comunicação entre nossa app e o Facebook através de js, pelo qual haverá uma Cross Domain Communication, pelo qual devemos criar um Channel entre nossa app e o Facebook, para o qual precisamos criar um arquivo xd_receiver.htm e armazená-lo em nosso server. Podem obter mais detalhes aqui, mas para a utilização dos User Control no GeneXus só precisamos levar em conta duas coisas:
1. quando criamos a app no Facebook indicar um Base Domain, com o qual indicamos o nome do domínio, onde por sua vez estará o arquivo xd_receiver.htm

2.
quando utilizarmos o User Control: FacebookConnect, o qual nos permitirá nos conectar com o Facebook, devemos indicar o caminho para o referido arquivo através da property xdChannelUrl, cujo valor por defeito é "/xd_receiver.htm".
Por isso, se no UC indicamos como xdChannelUrl o valor "/xd_receiver.htm,” então no caso de .Net devemos armazenar o arquivo em: C:\Inetpub\wwwroot, e no caso do Java utilizando tomcat como webserver em: C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps\ROOT.

Os três User Controls que temos atualizados hoje são:
FacebookConnect: necessário para estabelecer a conexão entre nossa app e o Facebook.
Text: text do botão que será adicionado a nosso form e que nos permitirá estabelecer a comunicação com o Facebook, valor por defeito: "Connect with Facebook".
ApiKey: como mencionamos antes é a Key associada à app que criamos no Facebook.
xdChannelUrl: url ou caminho ao arquivo xd_receiver.htm que nos permitirá estabelecer uma cross domain communication entre nossa app e o Facebook, valor por defeito: "/xd_receiver.htm”
Size: tamanho do botão, valores possíveis: small, medium, large, or xlarge, valor por defeito: "medium".
FacebookLoggedUser: mostra a foto de perfil e o nome do usuário logado no Facebook.
Width: width da foto, valor por defeito: 50.
Height: height da foto, valor por defeito: 50.
FacebookLogo: true/false, indica se quer mostrar ou não o logotipo do Facebook na foto, valor por defeito: true.
Linked: true/false, indica se quer ter um link ao perfil do Facebook na foto de perfil, valor por defeito: true.
FacebookShare: permite compartilhar um link no muro do usuário logado.
Link: link a compartilhar uma vez que o user clica no botão associado.
Type: tipo de botão, valores possíveis: box_count, button_count, button, icon, or icon_link, valor por defeito: button_count.
É possível obter os controles na gallery do GeneXus.
Se vocês observam o código destes User Controls é muito simples, portanto, podem checar a documentação da JavaScript Client Library do Facebook e desenvolver o próprio baseado em suas necessidades.
* O presente post foi originariamente publicado no Blog From Punta Espinillo to Tokio
Relacionado
GeneXus News 2.0
Canais 2.0
Sua empresa tem página no Facebook? Como se mantém atualizada?
Tweet: um user control para colocar twitter em seus objetos
Sigamos brincando… Agora o Twitter!
Especial #GeneXusOMelhorDe2014 :: Cloud Computing, Internet das Coisas, GeneXus X Evolution 3, Casos de Sucesso, Smart Devices e... Muitos mais!
Apps móveis: a chave para o crescimento de uma PME
Beacons: um olhar para o futuro do marketing tecnológico
#GX25 #Call4Speakers Nada mais, nada menos que 25 Encontros GeneXus
Avianca, a companhia aérea oficial do #G25 oferece descontos especiais para voos internacionais
A Comunidade GeneXus #Brasil organiza uma excursão partindo de Porte Alegre para assistir ao #GX25
GeneXus lança no SAP Forum Brasil GeneXus Early Adopter Program for SAP HANA Cloud Platform
GeneXus X Evolution 3 Upgrade 7
Novos parceiros acadêmicos no Brasil!