5-Integrando Aplicações Web Com As Redes Sociais - Revista Java Magazine 111

10/01/13 Integrando aplicaes web com as redes sociais - Revista Java Magazine 111
Pesquisar
Home Entenda o site Revistas Tecnologias Cursos Loja Virtual Frum Servios Publicar A ssine Compre Crditos
Seja bem-vindo, CA RLOS A LBERTO DA COSTA RA MOS! Fale conosco Meus Servios
2 Curtir 3 0 0
comentrios
revista Java Magazine
Integrando aplicaes web

com as redes sociais
O artigo mostra o poder das redes sociais como canal de
comunicao com as pessoas, os benefcios existentes na
integrao de aplicaes com as redes sociais e o framework
Spring Social como agente facilitador desta integrao.
favoritar marcar como lido inserir nota pessoal
Tipo: Tutorial
Do que se trata o artigo:
O artigo mostra o poder das redes sociais como canal de comunicao com as
pessoas, os benefcios existentes na integrao de aplicaes com as redes sociais
e o framework Spring Social como agente facilitador desta integrao.
Em que situao o tema til:

Os conceitos e o exemplo apresentados mostram ao leitor algumas formas nas
quais a integrao com as redes sociais pode trazer benefcios s aplicaes
consumidoras. Sendo assim, este tema til para profissionais da rea de TI que
queiram saber mais sobre a integrao com as redes sociais.
Integrando aplicaes web com as redes sociais:

Apresentaremos neste artigo a construo de uma aplicao web que se integra
com as redes sociais Facebook e Twitter atravs do uso do framework Spring
Social. Esta aplicao utiliza as redes sociais para estabelecer um canal de
comunicao com os seus usurios.
Atualmente, com a importncia cada vez maior das redes sociais na vida das pessoas e
a necessidade que estas sentem em criar relacionamentos, compartilhar fatos e
expressar opinies nestas redes, se torna fundamental o estudo e uso destas por
devmedia.com.br//26810 1/21
empresas, governos, pesquisadores, pessoas pblicas, etc.
As redes sociais possibilitam a criao de poderosos mecanismos de comunicao.

Atravs delas, por exemplo, pode haver a criao de um canal de comunicao entre
um governo e cidados, entre artistas e fs, entre empresas e clientes, entre outras
possibilidades.
Esta forma de comunicao mais direta cria um estreitamento no relacionamento de

entidades (empresas, governo, artistas) com as pessoas. Esta melhoria na
comunicao pode oferecer s entidades a fidelizao das pessoas, participao
colaborativa e criao de novas ideias atravs de feedbacks recebidos.
Com base nisso, a partir de um exemplo, iremos criar neste artigo um canal de
comunicao entre uma aplicao web e os telespectadores de uma empresa fictcia de
TV nas redes sociais. Para atingir este objetivo, sero criados perfis corporativos no
Facebook e no Twitter. Neste momento, discutiremos os detalhes ao redor da criao
destes perfis corporativos, mostrando dicas teis para uma melhor apresentao do
perfil nas redes sociais. Posteriormente, ser abordada a utilizao do framework
Spring Social, como agente facilitador no estabelecimento da comunicao entre a
aplicao web e as redes sociais.
O exemplo apresentado a continuao do exemplo publicado na Java Magazine 109,

que demonstrou de forma prtica a integrao de aplicaes web convencionais com as
redes sociais Twitter e Facebook atravs do uso do framework Spring Social.
Recapitulando a aplicao web de exemplo

Na Java Magazine 109, iniciamos o desenvolvimento de uma aplicao exemplo,
chamada de SocialTV. Esta aplicao um sistema web de uma empresa fictcia de TV
por assinatura tambm denominada SocialTV, que disponibiliza aos seus usurios um
servio de avisos sobre a programao da TV, de acordo com as preferncias de cada
usurio.
O Facebook e o Twitter sero utilizados como canais de interao com os

telespectadores da TV. A programao da TV ser divulgada via Facebook, e os
telespectadores cadastrados, recebero via Twitter, um alerta sobre programas que
tenham interesse. A Figura 1 mostra os casos de uso da aplicao.
Figura 1. Casos de Uso da SocialTV.
Na Edio 109, foi abordado o desenvolvimento dos casos de uso efetuados pelo ator
Usurio. Nesta edio, abordaremos o desenvolvimento dos casos de uso realizados
pelo Administrador do sistema e tambm a criao das pginas corporativas no
Facebook.
A seguir feito o detalhamento dos casos de uso realizados pelo Administrador:
Vincula perfil do Twitter: os administradores necessitam vincular respectiva

conta de acesso ao sistema, um perfil corporativo da SocialTV no Twitter. Este perfil ir
representar a SocialTV no Twitter, e atravs dele sero enviados os avisos sobre a
programao da TV a todos os usurios cadastrados neste servio;
Vincula perfil do Facebook: O administrador deve associar respectiva conta de

acesso ao sistema, um perfil social do Facebook que esteja configurado como
administrador da pgina corporativa da SocialTV no Facebook. Podem existir um ou
mais administradores de uma pgina corporativa no Facebook, e os detalhes da criao
destas pginas corporativas sero abordados mais adiante no artigo. Todos os
usurios que curtirem a pgina corporativa da SocialTV vo receber as atualizaes da
programao no respectivo perfil social, como acontece com um feed de notcias;
Cadastra programao da TV: O administrador cadastra a programao da TV

informando o nome do programa, o canal, o dia e o horrio em que cada programa
ser exibido. A programao recm-criada divulgada no Facebook. No caso de haver
algum usurio que tenha cadastrado o interesse por um programa existente na grade,
a aplicao enviar, atravs do perfil corporativo da SocialTV no Twitter, uma
mensagem direta para o perfil do usurio. Esta mensagem enviada contm o aviso
sobre a programao que acabou de ser criada.
Criao das Pginas Corporativas nas Redes

Sociais
As pginas corporativas nas redes sociais so os canais nos quais estabelecida a
comunicao e interao entre empresas e consumidores (usurios). No exemplo
utilizado, as pginas corporativas da SocialTV no Facebook e Twitter tm o objetivo de
informar os usurios da TV sobre a grade de programao, o que uma tarefa muito
importante dentro desta aplicao.
Tambm importante que estas pginas ou perfis corporativos tenham a marca da

empresa para uma fcil identificao por parte dos usurios. A Figura 2 mostra um
logotipo da SocialTV criado para ser utilizado como marca da TV nas redes sociais.
Figura 2. Logotipo da SocialTV.
Perfil Corporativo no Twitter

O Twitter no apresenta distino na criao dos perfis dos seus usurios. Todos os
perfis desta rede possuem a mesma estrutura e no so classificados como, por
exemplo, corporativo ou pessoal. O procedimento para a criao do perfil da SocialTV
no Twitter feito da mesma forma como o leitor provavelmente tenha feito o seu
prprio perfil nesta rede, veja Links.
A classificao de um perfil do Twitter como corporativo feita de forma abstrata, por

exemplo, utilizando logotipos e nomes de empresas ao invs de fotos e nomes de
pessoas. A Figura 3 mostra o perfil corporativo da SocialTV no Twitter.
Figura 3. Pgina corporativa da SocialTV no Twitter.
Pgina Corporativa no Facebook

Ao contrrio do Twitter, o Facebook apresenta distino entre um perfil de usurio e
um perfil corporativo. Na realidade, at o nome destes objetos se diferenciam. Nesta
rede no existem perfis para empresas, mas, sim, pginas corporativas. Na definio
do prprio Facebook, uma pgina um lugar criado para construir uma relao mais
prxima com o pblico e clientes. Ao contrrio das pginas, os perfis so utilizados
apenas para identificar pessoas. At mesmo se voc tentar criar no Facebook, um
perfil que represente uma empresa ao invs de uma pessoa, possvel que no tenha
sucesso, pois, existe um controle para validar se o nome escolhido para o perfil
mesmo um nome de pessoa.
O endereo para a criao de pginas no Facebook pode ser encontrado na seo

Links. Acessando este endereo, temos a opo de criar uma pgina dos seguintes
tipos:
Negcios locais ou local;
Empresa, organizao ou instituio;
Marca ou produto;
Artista, banda ou figura pblica;
Entretenimento;
Causa ou comunidade.
Dentre os tipos disponveis o que mais se enquadrou no exemplo da SocialTV foi o

tipo Empresa, ento selecionaremos esta opo. Em seguida devemos informar a
categoria e nome da empresa. A categoria que utilizaremos Telecomunicaes e o
nome da empresa fica a critrio do leitor. Feito isso, dever ser vinculada pgina
corporativa que criamos uma conta de usurio do Facebook que atuar como o
administrador. permitida a utilizao de uma conta do Facebook pr-existente ou a
criao de uma nova. Aps a confirmao da conta de usurio, so oferecidas as
opes de configurao da pgina corporativa, como o envio do logotipo, descrio e
vnculo ao site da empresa. Pronto, est criada a sua pgina corporativa no Facebook.
A pgina corporativa criada para a SocialTV mostrada na Figura 4.
importante ressaltar que um mesmo usurio pode administrar mais de uma pgina
do Facebook ao mesmo tempo, e que uma pgina pode ter N administradores.
Figura 4. Pgina corporativa da SocialTV no Facebook.
Iniciando o desenvolvimento dos casos de

uso do ator administrador
Como destacado anteriormente, o exemplo apresentado neste artigo continuao do
exemplo apresentado na Java Magazine 109. Nesta edio ser abordado o
desenvolvimento dos casos de uso do ator administrador.
Estes casos de uso so inicializados quando o administrador efetua o login no sistema.

Na Edio 109 j foi codificada toda a lgica do login, atravs do uso do framework
Spring Security. O que resta a ser feito agora, com relao ao login dos usurios
administradores do sistema, a insero manual destes usurios no banco de dados.
A Listagem 1 mostra os comandos SQL para a criao de um usurio administrador
padro a ser utilizado no sistema.
Listagem 1. Comando para criao de um usurio administrador no banco de dados.
1 insert into USER (DES_LOGIN, NME_USER, DES_PASSWORD)

2 values ('admin', 'Administrador', 'admin');
Com a criao deste usurio no banco de dados, o acesso do administrador do

sistema j pode ser testado utilizando o usurio e senha iguais a admin.
Em seguida, criaremos as pginas e a lgica para a interao dos administradores no

sistema. A Listagem 2 mostra a pgina home.jsp (Listagem 2), que ser utilizada
como pgina inicial de acesso dos administradores ao sistema. Recapitulando aos
leitores que o framework Spring MVC, configurado no nosso exemplo, procura os
arquivos JSP da aplicao na pasta /WEB-INF/views. Esta configurao est presente
no arquivo WebMvcConfig.java.
Listagem 2. Cdigo da pgina home.jsp.
1 <%@ page language="java" contentType="text/html;

2 charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
3 <%@ taglib uri="http://java.sun.com/jsp/jstl/
4 core" prefix="c"%>
5 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01
6 Transitional//EN" "http://www.w3.org/
7 TR/html4/loose.dtd">
8 <html>
9 <head>
10 <meta http-equiv="Content-Type" content="text/html;
11 charset=ISO-8859-1">
12 <link rel="stylesheet" href="<c:url value="/resources/
13 css/ui-lightness/jquery-ui-1.8.21.custom.css" />"
14 type="text/css" media="screen" />
15 <link rel="stylesheet" href="<c:url
16 value="/resources/
17 css/base.css" />" type="text/css"/>
18 <script type="text/javascript" src="<c:url
20 scripts/jquery-1.7.2.min.js" />"></script>
21 <script type="text/javascript" src="<c:url
23 scripts/jquery-ui-1.8.21.custom.min.js" />"></script>
24 <title>SocialTV Home Page</title>
25 <script>
26 $(document).ready(function (){
27 $('#navigation a').hover(
28 function(){
29 $(this).addClass('navHover');
30 }
31 , function() {
32 $(this).removeClass('navHover');
33 }
34 );
35 });
36 </script>
37 </head>
38 <body><h3>Bem vindo, ${usuario.nome}</h3><hr/>
39 <c:if test="${mensagemErro != null }">
40 <div class="ui-widget">
41 <div class="ui-state-error ui-corner-all"
42 style="margin-top: 20px; padding: 0 .7em;">
43 <p><span class="ui-icon ui-icon-circle-close"
44 style="float: left; margin-right: .3em;">
45 </span>${mensagemErro}</p>
46 </div></div>
47 </c:if>
48 <span>Opes</span>
49 <ul id="navigation">
50 <li>
51 <a href='<c:url value="/admin/incluirProgramacao"/>'>
52 Incluir programa na grade</a>
53 </li>
54 <li>
55 <a href='<c:url value="/connect/facebook"/>'>
56 Vincular seu usurio ao facebook?</a>
57 </li>
58 <li>
59 <a href='<c:url value="/connect/twitter"/>'>
60 Vincular seu usurio ao twitter?</a>
61 </li>
62 </ul>
63 </body>
64 </html>
A pgina home.jsp basicamente contm um menu com as opes de navegao que o

administrador pode executar na SocialTV. O leitor atento deve ter reparado que as
URLs do menu esto mapeadas aos casos de uso do administrador do sistema, como
mostra a Tabela 1.
Tabela 1. Mapeamento entre casos de uso e URLs do sistema.
Podemos agora testar o login dos administradores do sistema atravs da inicializao

do Tomcat e acessando o seguinte endereo: http://localhost:8080/SocialTv/. Utilize o
usurio e senha iguais a admin para a autenticao do administrador. A Figura 5
mostra a tela apresentada ao administrador aps o login.
Figura 5. Tela home.jsp aps login do administrador.
Embora a tela exibida na Figura 5 apresente o caso de uso Cadastra programao da

TV como primeira opo, este ser o ltimo a ser desenvolvido. A razo para isto
que o seu funcionamento depende de dados gerados nos outros dois casos de uso.
importante ressaltar que o caso de uso Vincula perfil do Twitter j foi desenvolvido
na Java Magazine 109 e deve estar funcionando no projeto. Ento a ordem de
desenvolvimento que seguiremos a seguinte: 1) Vincula perfil do Facebook e 2)
Cadastra programao da TV.
recomendado ao leitor testar o caso de uso Vincula perfil do Twitter para ter
certeza de que o mesmo est funcionando e tambm para vincular a conta corporativa
da SocialTV no twitter conta do administrador do sistema.
Caso de uso Vincula perfil do Facebook

Este caso de uso responsvel por criar os vnculos entre perfis de usurio do
Facebook e usurios da SocialTV. Para este caso especifico, o vnculo ocorrer entre
um usurio administrador da SocialTV e um perfil do Facebook.
Os passos necessrios para o desenvolvimento deste caso de uso so idnticos aos

passos executados no desenvolvimento do caso de uso Vincula perfil do Twitter, que
j foi realizado.
Resumindo novamente a criao de vnculos entre as redes sociais e as aplicaes

Spring Social, o primeiro passo a ser feito uma requisio HTTP do tipo GET URL
http://{Servidor}:{Porta}/{Aplicao}/connect/{Provedor}. No exemplo da SocialTV,
as variveis desta URL seriam resolvidas de acordo com a Tabela 2.
Tabela 2. Nomes e valores das variveis utilizadas pelo Spring Social.
Lembrando que uma requisio HTTP do tipo GET pode ser feita atravs de hyperlinks
HTML, como fizemos na pgina home.jsp (Listagem 2). Nesta pgina temos os
seguintes links:
http://localhost:8080/SocialTv/connect/facebook;
http://localhost:8080/SocialTv/connect/twitter.
No primeiro link, estamos iniciando uma requisio para vnculo com o Facebook e no
segundo link, uma requisio para vnculo com o Twitter. Se tivssemos criado um
terceiro link, trocando o valor da varivel {provedor} por linkedin, estaramos da
mesma forma iniciando a criao de um vnculo com a rede social profissional de
mesmo nome. Os valores da varivel {provedor} devem ser iguais ao valor do Id das
redes sociais utilizados pelo Spring Social. Dentro do nosso exemplo, os valores
devem ser iguais a facebook ou twitter.
Para este caso de uso em especfico, estamos interessados na criao do vnculo com
o Facebook, ento a URL http://localhost:8080/SocialTv/connect/facebook dever ser
utilizada. Se o leitor, atravs da pgina home.jsp, tentar acessar este link, ir receber
uma pgina de erro. Isto acontece porque todas as requisies efetuadas para a nossa
aplicao com a URL /connect/{provedor} so interceptadas pelo controlador de
conexes do Spring Social, e este controlador exige a criao de duas pginas JSP,
chamadas respectivamente de connect/{provedor}Connect.jsp e
connect/{provedor}Connected.jsp. Como ainda no criamos estas pginas para o
Facebook, o erro acontece. As Listagens 3 e 4 mostram respectivamente o cdigo
para a pgina facebookConnect.jsp e facebookConnected.jsp. importante ressaltar
que estas pginas devem ser criadas dentro do diretrio WEB-INF/views/connect.
Listagem 3. Cdigo da pgina facebookConnect.jsp.
1 <%@ taglib uri="http://java.sun.com/jsp/jstl/core"

2 prefix="c" %>
3 <html>
4 <head>
7 <title>SocialTV - Espao do Telespectador</title>
9 css/ui-lightness/jquery-ui-1.8.21.custom.css" />"
10 type="text/css"/>
13 </head>
14 <body>
15 <h3>Vincular conta ao Facebook</h3>
16 <form action="<c:url value="/connect/facebook" />"
17 method="POST">
18 <input type="hidden" name="scope"
19 value="publish_stream,manage_pages"/>
20 <div class="formInfo">
21 <p>Sua conta ainda no possui vnculo ao facebook.
22 Clique no boto abaixo para vincular sua conta
23 ao facebook.</p>
24 </div>
25 <p>
26 <button type="submit"><img src="<c:url
28 images/bt_facebook.gif" />"/></button>
29 </p>
30 </form>
31 </body>
32 </html>
Listagem 4. Cdigo da pgina facebookConnected.jsp.
1 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

2 <html>
3 <head>
6 <title>SocialTV - Espao do Telespectador</title>
8 css/ui-lightness/jquery-ui-1.8.21.custom.css" />" type="text/css"/>
11 </head>
12 <body>
13 <h3>Conta Vinculada ao Facebook</h3>
14 <form id="disconnect" method="post">
15 <div class="formInfo">
16 <p>
17 J estamos conectados a sua conta do Facebook.
18 Clique aqui se voc desejar desconectar.
19 </p>
20 </div>
21 <button type="submit">Desconectar</button>
22 <input type="hidden" name="_method" value="delete" />
23 </form>
24 <a href='<c:url value="/"/>'>Voltar a pgina principal</a>
25 </body>
26 </html>
A pgina {provedor}Connect.jsp utilizada pelo controlador de conexes do Spring

Social quando o usurio logado no sistema local (SocialTV) ainda no possui nenhum
perfil associado ao Facebook. Esta pgina oferece ento ao usurio local, neste caso
um administrador da SocialTV, a oportunidade de criar o vnculo com uma conta da
rede social.
A pgina {provedor}Connected.jsp, por sua vez, utilizada pelo controlador de

conexes quando uma conexo entre o usurio logado e a rede social j existe.
Lembrando que as conexes existentes entre usurios locais e redes sociais so
mantidas no banco de dados local MySQL, na tabela chamada userconnection, que foi
criada no artigo anterior.
Para testarmos este caso de uso, devemos acessar a aplicao em

http://localhost:8080/SocialTv/ e efetuar o login como administrador do sistema. Na
home page mostrada, deveremos ento acessar o link Vincular seu usurio ao
facebook?. Como o administrador ainda no possui vnculo com esta rede, a pgina
facebookConnect.jsp ser exibida, como mostra a Figura 6.
Figura 6. Pgina facebookConnect.jsp.
Esta pgina apresenta ao usurio um boto que inicia o processo de integrao entre
usurio logado, SocialTV e Facebook. Ao clicar no boto, uma requisio HTTP do tipo
POST com a URL igual a /connect/{provedor} enviada a SocialTV. Como discutido
anteriormente, as requisies com este padro de URL so interceptadas pelo
controlador de conexes do Spring Social. Toda a requisio do tipo POST que
recebida pelo controlador de conexes tratada como uma conexo nova, a ser criada
com o provedor de servios utilizado, neste caso o Facebook. Ento, ao receber esta
requisio, o controlador inicia o processo de autorizao junto ao provedor de
servios, e uma tela pedindo autorizao ao usurio para que a SocialTV acesse seus
dados exibida. A Figura 7 mostra a tela de autorizao exibida pelo Facebook.
Figura 7. Tela de autorizao exibida ao usurio pelo Facebook para conceder o

acesso bsico SocialTV.
Como pode ser visto na Figura 7, o aplicativo chamado CWByte IT Services (nesta
tela ser mostrado o nome do aplicativo do Facebook criado pelo leitor no artigo
anterior) est pedindo acesso s informaes bsicas do usurio na rede social. As
informaes bsicas so dados como id, nome, foto, sexo, etc. Este acesso no
suficiente para os administradores da SocialTV, pois estes precisam de autorizao
para acessar a pgina corporativa da TV no Facebook e tambm precisam de acesso
para publicar contedo (publicar a programao da TV na pgina corporativa).
Quando uma aplicao consumidora necessita de acessos que vo alm das

informaes bsicas do usurio do Facebook, esta aplicao deve pedir estes acessos
necessrios explicitamente na requisio de criao da conexo com a rede social
(requisio POST feita URL /connect/facebook) atravs do parmetro chamado
scope. Analisando o cdigo da pgina facebookConnect.jsp (Listagem 3), temos a
criao de um parmetro chamado scope, que define os nveis de acesso a serem
requisitados pela SocialTV, como mostrado a seguir:
<input type="hidden" name="scope" value="publish_stream,manage_pages"/>
A nossa aplicao web utiliza os acessos chamados publish_stream e manage_pages,

que so responsveis pela postagem de contedo em nome do usurio e pelo
gerenciamento de pginas, respectivamente. A pgina web que contm a lista completa
dos acessos disponveis para aplicativos do Facebook est presente na seo Links.
Quando o usurio autoriza a conexo com o aplicativo da SocialTV (Figura 7), ele
redirecionado para a pgina mostrada na Figura 8. Esta pgina pede permisso ao
usurio para que o aplicativo utilizado na aplicao consumidora tenha acessos
adicionais. Para este caso, os acessos adicionais so os de Gerenciar suas pginas e
Publicar em seu nome.
Figura 8. Tela de autorizao exibida ao usurio pelo Facebook para conceder os

acessos adicionais SocialTV.
Finalmente, ao permitir o acesso ao aplicativo, o usurio redirecionado novamente

para a pgina da SocialTV, como mostra a Figura 9. A pgina mostrada a
facebookConnected.jsp, o que indica que a conexo entre usurio (administrador do
sistema), SocialTV e Facebook foi realizada com sucesso. Esta tela apresenta ainda a
opo do usurio desfazer esta conexo atravs do boto Desconectar.
Figura 9. Tela facebookConnected, que confirma que uma conexo com o Facebook
foi criada.
Como prova de conceito, o leitor pode executar um comando SQL para retornar os
registros da tabela userconnection e verificar a existncia de um registro, que associa
o usurio admin rede social Facebook.
Caso de uso Cadastra programao da TV

Este caso de uso realiza o objetivo da aplicao SocialTV, que informar e alertar os
telespectadores da TV sempre que um novo programa entra na grade de

programao. O administrador do sistema responsvel por cadastrar os programas
de TV, informando o nome do programa, canal, data e hora. Aps este cadastro existe
um processo na aplicao SocialTV que pesquisa a existncia de usurios que tenham
cadastrado o interesse no programa recm-criado. Havendo algum usurio que se
enquadra na pesquisa, um aviso contendo informaes sobre o programa enviado
pela SocialTV atravs do mecanismo de mensagens diretas do Twitter. A programao
recm-criada tambm anunciada na pgina corporativa do Facebook. Os dados da
programao so armazenados no banco de dados MySQL, na tabela chamada
PROGRAMACAO.
Como vimos no arquivo home.jsp, apresentado na Listagem 4, a pgina de incluso

da programao da TV realizada na URL /admin/incluirProgramacao. O passo inicial
no desenvolvimento deste caso de uso a criao do controlador responsvel pelo
processamento de requisies que chegam aplicao com esta URL. A classe
controladora das requisies que chegam SocialTV a DefaultController, j criada
no outro artigo. Devemos ento adicionar classe DefaultController um mtodo para
a manipulao das requisies URL /admin/incluirProgramacao. A Listagem 5
apresenta tal mtodo. Note que ele anotado com @RequestMapping que, como
esperado, faz o mapeamento da requisio URL /admin/incluirProgramacao e ao
mtodo HTTP do tipo GET.
Listagem 5. Mtodo incluirProgramacao() que deve ser inserido na classe

DefaultController.
1 @RequestMapping(value="/admin/incluirProgramacao",
2 method=RequestMethod.GET)
3 public String incluirProgramacao(Model model){
4
5 //se o usurio no estiver vinculado nem a twitter nem
6 a facebook ento geramos um erro
7 if(!isUserAuthenticatedOnFacebook() ||
8 !isUserAuthenticatedOnTwitter()){
9 model.addAttribute("mensagemErro", "Sua conta de usurio
10 deve ser associado ao Facebook e Twitter.");
11 return "home";
12 }
13
14 Programacao programacao = new Programacao();
15 programacao.setHoraInicio("12:00");
16 model.addAttribute("programacao", programacao);
17
18 return "incluirProgramacao";
19 }
O mtodo incluirProgramacao() primeiramente valida se a conta do administrador do

sistema j possui vnculos com o Facebook e Twitter. Caso o administrador ainda no
possua vnculo com alguma das duas redes sociais, uma mensagem de erro gerada e
o fluxo retornado para a pgina home.jsp.
Em seguida este mtodo cria um objeto do tipo Programacao. Este objeto um

POJO que representa, no modelo de dados, a programao de TV a ser criada. A
Listagem 6 apresenta o cdigo deste POJO. Perceba que os atributos desta classe
mapeiam exatamente os campos do banco de dados presentes na tabela
PROGRAMACAO.
Uma dica importante na edio da classe DefaultController a adio do import do

objeto Programacao recm-criado, evitando-se assim erros de compilao pela falta
da definio desta classe.
Listagem 6. Cdigo da classe Programacao.
1 package br.com.javamagazine.socialtv.model;
2
3 import java.util.Date;
4 import org.springframework.format.annotation.DateTimeFormat;
5
6 public class Programacao {
7
8 private Integer idf;
9 private String nomePrograma;
10 private String canal;
11
12 @DateTimeFormat(pattern="dd/MM/yyyy")
13 private Date dataInicio;
14
15 private String horaInicio;
16
17 public Integer getIdf() {
18 return idf;
19 }
20
21 public void setIdf(Integer idf) {
22 this.idf = idf;
23 }
24
25 public String getNomePrograma() {
26 return nomePrograma;
27 }
28
29 public void setNomePrograma(String nomePrograma) {
30 this.nomePrograma = nomePrograma;
31 }
32
33 public String getCanal() {
34 return canal;
35 }
36
37 public void setCanal(String canal) {
38 this.canal = canal;
39 }
40
41 public Date getDataInicio() {
42 return dataInicio;
43 }
44
45 public void setDataInicio(Date dataInicio) {
46 this.dataInicio = dataInicio;
47 }
48
49 public String getHoraInicio() {
50 return horaInicio;
51 }
52
53 public void setHoraInicio(String horaInicio) {
54 this.horaInicio = horaInicio;
55 }
56 }
O mtodo controlador que adicionamos na Listagem 5 tem como retorno uma String
com o valor incluirProgramacao. Este resultado referente ao nome da pgina JSP
que exibir a resposta requisio do usurio. A Listagem 7 contm o cdigo de tal
pgina, chamada incluirProgramacao.jsp. Salientando novamente a necessidade das
pginas JSP serem criadas dentro do folder WEB-INF/views.
Listagem 7. Cdigo da pgina incluirProgramacao.jsp.
1 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

2 <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
3 <html><head>
4 <title>SocialTv - Incluir Programao</title>
5 <link rel="stylesheet" href="<c:url value="/resources/css/ui-lightness/
6 jquery-ui-1.8.21.custom.css" />"
7 type="text/css" media="screen" />
8 <link rel="stylesheet" href="<c:url value="/resources/css/base.css" />"
9 type="text/css"/>
10 <script type="text/javascript" src="<c:url value="/resources/scripts/
11 jquery-1.7.2.min.js" />"></script>
12 <script type="text/javascript" src="<c:url value="/resources/scripts/
13 jquery-ui-1.8.21.custom.min.js" />"></script>
14 <script type="text/javascript">
15 $(function() {
16 $("#txtDataInicio").datepicker(
17 { dateFormat : "dd/mm/yy", showOn : "button", buttonImage :
18 '<c:url value="/resources/images/bt_calendario.gif"/>',
19 buttonImageOnly : true
20 }
21 );
22 });
23 </script>
24 </head>
25 <body>
26 <div id="mensagemContainer">
27 <c:if test="${mensagemErro != null }">
29 <div class="ui-state-error ui-corner-all"
31 <p>
32 <span class="ui-icon ui-icon-circle-close"
33 style="float: left; margin-right: .3em;"></span>
34 ${mensagemErro}
35 </p> </div> </div> </c:if>
36 <c:if test="${mensagemSucesso != null }">
38 <div class="ui-state-highlight ui-corner-all"
40 <p>
41 <span class="ui-icon ui-icon-circle-check"
42 style="float: left; margin-right: .3em;"></span>
43 ${mensagemSucesso}
44 </p> </div></div> </c:if></div>
45 <form:form method="post" modelAttribute="programacao">
46 <table><tr>
47 <td><form:label path="nomePrograma">Nome do Programa:</form:label></td>
48 <td><form:input path="nomePrograma" id="txtNomePrograma" size="50"/></td>
49 </tr><tr>
50 <td><form:label path="canal">Canal:</form:label></td>
51 <td><form:select path="canal">
52 <form:option value="AXN"/>
53 <form:option value="Cinemax"/>
54 <form:option value="Discovery Kids"/>
55 <form:option value="Discovery Channel"/>
56 <form:option value="Disney"/>
57 <form:option value="ESPN"/>
58 <form:option value="Fox"/>
59 <form:option value="FX"/>
60 <form:option value="HBO"/>
61 <form:option value="Megapix"/>
62 <form:option value="MTV"/>
63 <form:option value="Multishow"/>
64 <form:option value="Playboy"/>
65 <form:option value="SportTV"/>
66 </form:select>
67 </td></tr> <tr>
68 <td><form:label path="dataInicio">Data:</form:label></td>
69 <td>
70 <form:input path="dataInicio" size="16" maxlength="12"
71 id="txtDataInicio" readonly="true" cssClass="disabled"/>
72 </td> </tr> <tr>
73 <td><form:label path="horaInicio">Horrio:</form:label></td>
74 <td>
75 <form:select path="horaInicio">
76 <form:option value="01:00"/><form:option value="02:00"/>
88 </form:select>
89 </td></tr><tr>
90 <td colspan="2"><input type="submit" value="Adicionar"/></td>
91 </tr>
92 </table>
93 </form:form>
94 </body>
95 </html>
A respeito dessa pgina, importante ressaltar a utilizao das bibliotecas JavaScript

jQuery e jQuery UI, veja Links. Empregamos o jQuery UI para tirar proveito do
componente de data fornecido pela biblioteca. Outro ponto de importncia no cdigo
fonte JSP a presena da tag <form:form>. Esta uma tag do Spring MVC para
facilitar o uso de forms, integrando os campos dos formulrios com os objetos Java
do lado servidor. O atributo chamado modelAttribute faz referncia ao nome de um
objeto JavaBean que contm os dados do form. Neste caso, o nome do objeto
JavaBean que utilizamos programacao. Ele faz referncia ao objeto de
Programacao definido no mtodo apresentado na Listagem 5.
Aps a criao da pgina onde os administradores do sistema podem cadastrar a

programao, devemos adicionar o cdigo no controlador responsvel por esta
operao. A Listagem 8 apresenta o mtodo controlador designado para receber as
requisies HTTP do tipo POST URL /admin/incluirProgramacao. Isto acontece
quando o administrador clica no boto Adicionar no form de incluso da programao
e assim submete os dados inseridos na tela ao servidor. Note que o atributo chamado
method da anotao @RequestMapping est agora com o valor igual a POST.
Listagem 8. Mtodo incluirProgramacao_Adicionar() que deve ser includo na classe

DefaultController.
1 @RequestMapping(value="/admin/incluirProgramacao",
2 method=RequestMethod.POST)
3 public String incluirProgramacao_Adicionar
4 (@ModelAttribute("programacao") Programacao programacao, Model model){
5
6 String erroValidacao = "";
7
8 if(programacao.getNomePrograma() == null ||
9 programacao.getNomePrograma().isEmpty()){
10 erroValidacao = "Nome do programa obrigatrio!<br/>";
11 }
12
13 if(programacao.getDataInicio() == null){
14 erroValidacao += "Data obrigatrio!";
15 }
16
17 if(!erroValidacao.isEmpty()){
18 model.addAttribute("mensagemErro", erroValidacao);
20 }
21
22 try {
23 service.adicionarProgramacao(programacao);
24 model.addAttribute("mensagemSucesso",
25 "Programao criada com sucesso.");
26 List<Usuario> usuarios = service.getUsuariosPorPreferencia
27 (programacao.getNomePrograma());
28 String avisoProgramacao = criarMensagemDeAviso(programacao);
29 enviarAvisoDeProgramacaoAosUsuarios(usuarios, avisoProgramacao);
30 enviarMensagemViaFacebook(avisoProgramacao);
31 } catch (Exception e) {
32 e.printStackTrace();
33 model.addAttribute("mensagemErro", "Erro ao tentar inserir
34 programao no Banco de Dados!");
35 }
36
38 }
Este mtodo, primeiramente, faz a validao dos dados inseridos pelo administrador
para ter certeza de que nenhum campo obrigatrio foi deixado em branco. Aps a
validao do formulrio, no cdigo que se encontra dentro do bloco try/catch, existe
muita coisa acontecendo, e iremos explanar uma a uma a seguir. O leitor pode
perceber a existncia de alguns erros de compilao, pois alguns mtodos e classes
utilizados neste cdigo ainda no foram criados.
A primeira tarefa esperada deste mtodo de criao da programao a insero dos

dados no banco de dados relacional. Para isso, devemos ter acesso classe
SocialTvService (Listagem 9), que quem abstrai todas as operaes de banco de
dados na aplicao. Nesta classe, o mtodo adicionarProgramacao() o
responsvel pela insero da programao de TV no banco de dados. Para corrigir o
erro de compilao na classe controladora, referente definio da varivel service,
adicione o seguinte atributo classe DefaultController:
@Inject private SocialTvService service;
Como a anotao @Inject indica, o objeto SocialTvService ser injetado pelo Spring
na classe controladora.
Um importante detalhe ao leitor que o mtodo

DefaultController.criarAlarmesParaUsuario(), j criado no outro artigo, tem uma
referncia ao atributo service desabilitada atravs do uso de um comentrio Java
(//). O leitor pode agora descomentar esta linha para habilitar a gravao dos
interesses do usurio no banco de dados.
Listagem 9. Cdigo da classe SocialTvService, responsvel pela manipulao do banco

de dados da aplicao.
1 package br.com.javamagazine.socialtv.service;
2
3 //imports omitidos...
4
5 @Service
6 public class SocialTvService {
7
8 @Inject JdbcTemplate jdbcTemplate;
9 @Transactional public void gravarInteressesUsuario
10 (Usuario usuario) throws Exception {
11 for (Interesse interesse : usuario.getInteresses()) {
12 gravarInteresseUsuario(usuario.getUserId(), interesse);
13 }
14 }
15
16 private void gravarInteresseUsuario(final String userId,
17 final Interesse interesse) throws SQLException {
18 String sql = "INSERT INTO INTERESSES_USUARIO " +
19 "(userId, DES_INTERESSE, URL_FOTO_INTERESSE) VALUES (?,?,?)";
20 jdbcTemplate.update(sql, new PreparedStatementSetter() {
21 @Override
22 public void setValues(PreparedStatement ps) throws SQLException {
23 ps.setString(1, userId);
24 ps.setString(2, interesse.getDescricao());
25 String urlFoto = interesse.getUrlFoto();
26 if(urlFoto.length() > 200)
27 urlFoto= urlFoto.substring(0, 200);
28 ps.setString(3, urlFoto);
29 }
30 });
31 }
32
33 @Transactional public void adicionarProgramacao
34 (final Programacao programacao) throws Exception{
35 String sql = "INSERT INTO PROGRAMACAO(NOME_PROGRAMA, CANAL, "
36 + " DATA_INICIO, HORA_INICIO) VALUES (?,?,?,?)";
37
38 jdbcTemplate.update(sql, new PreparedStatementSetter() {
39 @Override
40 public void setValues(PreparedStatement ps) throws SQLException {
41 int rowIndex = 1;
42 ps.setString(rowIndex++, programacao.getNomePrograma());
43 ps.setString(rowIndex++, programacao.getCanal());
44 ps.setDate(rowIndex++, new java.sql.Date(programacao
45 .getDataInicio().getTime()));
46 ps.setString(rowIndex++, programacao.getHoraInicio());
47 }
48 });
49 }
50
51 @Transactional(readOnly = true) public List<Interesse>
52 getInteressesDoUsuario(String userId) {
53 final List<Interesse> interesses = new ArrayList<Interesse>();
54 String sql = "SELECT DES_INTERESSE, URL_FOTO_INTERESSE "
55 + " FROM INTERESSES_USUARIO WHERE userId = ?";
56 jdbcTemplate.query(sql, new Object[] { userId },
57 new RowCallbackHandler() {
58 @Override
59 public void processRow(ResultSet rs) throws SQLException {
60 Interesse interesse = new Interesse();
61 interesse.setDescricao(rs.getString("DES_INTERESSE"));
62 interesse.setUrlFoto(rs.getString("URL_FOTO_INTERESSE"));
63 interesses.add(interesse);
64 }
65 });
66 return interesses;
67 }
68
69 @Transactional(readOnly = true) public List<Usuario>
70 getUsuariosPorPreferencia(String nomePrograma) {
71 final ArrayList<Usuario> usuarios = new ArrayList<Usuario>();
72 String sql = "SELECT uc.userId, uc.providerId, uc.providerUserId "+
73 " FROM INTERESSES_USUARIO iu " +
74 " JOIN userconnection uc on uc.userId = iu.userId " +
75 " WHERE UPPER(iu.DES_INTERESSE) like '"+nomePrograma + "%'";
76 jdbcTemplate.query(sql,
77 new RowCallbackHandler() {
78 @Override
79 public void processRow(ResultSet rs) throws SQLException {
80 String userId = rs.getString("userId");
81 Usuario usuario = new Usuario(userId, userId);
82 usuario.setProviderId(rs.getString("providerId"));
83 usuario.setProviderUserId(rs.getString("providerUserId"));
84 usuarios.add(usuario);
85 }
86 }
87 );
88 return usuarios;
89 }
90 }
Aps a insero da programao que feito o que realmente interessa na aplicao
SocialTV, a gerao dos avisos da programao da TV. Para isso, necessrio a
recuperao de todos os usurios que tenham cadastrado o interesse no programa
recm-criado. Isto feito no mtodo
SocialTvService.getUsuariosPorPreferencia(), que retorna uma lista de usurios
que possuem interesse no programa passado como parmetro. Estes usurios so
encontrados por meio de uma consulta SQL realizada no banco de dados local.
Aps a recuperao dos usurios com interesse no programa, criada a mensagem a

ser enviada a estes usurios, como mostra a Listagem 10.
Listagem 10. Cdigo do mtodo criarMensagemDeAviso(), que deve ser includo na

classe DefaultController.
1 private String criarMensagemDeAviso(Programacao programacao){

2 SimpleDateFormat sdf = new SimpleDateFormat("dd/MM");
3 StringBuilder mensagem = new StringBuilder
4 ("Programao SocialTv: " +programacao.getNomePrograma());
5 mensagem.append(" no canal "+programacao.getCanal());
6 mensagem.append(" dia "+sdf.format(programacao.getDataInicio()));
7 mensagem.append(" s "+programacao.getHoraInicio());
8 return mensagem.toString();
9 }
Com a lista de usurios e a mensagem criada, o aviso sobre a programao j pode

ser enviado via Twitter para as pessoas cadastradas, e via Facebook para a pgina
corporativa da SocialTV. Os mtodos responsveis pelo envio do aviso da
programao, tanto para Twitter quanto para Facebook, apresentado na Listagem
11.
Listagem 11. Cdigo dos mtodos para envio do aviso da programao (Twitter e
Facebook).
1 private void enviarMensagemViaFacebook(String message){

2 if(isUserAuthenticatedOnFacebook() && facebook.pageOperations().
3 getAccounts() != null &&
4 !facebook.pageOperations().getAccounts().isEmpty()){
5 String idPagina = facebook.pageOperations().getAccounts().
6 get(0).getId();
7 enviarMensagemViaRedeSocial(facebook, message, idPagina);
8 }
9 }
10
11 private void enviarAvisoDeProgramacaoAosUsuarios(List<Usuario>
12 usuarios, String mensagem){
13 for(Usuario usuarioASerAlertado : usuarios){
14 if("twitter".equals(usuarioASerAlertado.getProviderId())
15 && isUserAuthenticatedOnTwitter()){
16 enviarMensagemViaRedeSocial(twitter, mensagem,
17 usuarioASerAlertado.getProviderUserId());
18 }
19 }
20 }
21
22 private void enviarMensagemViaRedeSocial(ApiBinding redeSocial,
23 String message, String recipientId){
24 try{
25 if(redeSocial instanceof Facebook){
26 ((Facebook)redeSocial).pageOperations().post(recipientId, message);
27 }else if(redeSocial instanceof Twitter){
28 ((Twitter)redeSocial).directMessageOperations().
29 sendDirectMessage(new Long(recipientId), message);
30 }
31 }catch(Exception ex){
32 ex.printStackTrace();
33 }
34 }
O mtodo enviarMensagemViaFacebook() envia a mensagem de aviso sobre a
programao como um POST na pgina corporativa da SocialTV. No incio da sua
execuo existe uma validao para verificar se o administrador do sistema possui uma
conta do Facebook associada. Isto acontece atravs do mtodo
isUserAuthenticadedOnFacebook(). Tambm existe a verificao para checar se o
administrador possui ao mnimo uma pgina desta rede social, a qual seja o
responsvel. Isto feito atravs da comparao
facebook.pageOperations().getAccounts() != null. Aps a validao,
recuperado o ID da pgina corporativa da SocialTV, com o cdigo
facebook.pageOperations().getAccounts().get(0).getId(). Este trecho de cdigo
parte do princpio de que o usurio administrador do sistema SocialTV gerencia apenas
uma pgina corporativa e, por isso, recupera a primeira pgina associada a ele,
utilizando o ndice zero (getAccounts.get(0)). Caso o administrador gerenciasse mais
de uma pgina, outro mecanismo seria necessrio para recuperar o ID da pgina
corporativa da SocialTV. De posse do ID da pgina corporativa, delegado ao mtodo
enviarMensagemViaRedeSocial() a postagem da mensagem de aviso sobre a
programao. O cdigo responsvel pela postagem mostrado na Listagem 12.
Listagem 12. Trecho de cdigo responsvel por enviar o aviso sobre a programao
SocialTV pgina da TV no Facebook.
1 if(redeSocial instanceof Facebook){

2 ((Facebook)redeSocial).pageOperations().post(recipientId, message);
3 }
Vale ressaltar que o parmetro recipientId referente ao ID da pgina corporativa da

SocialTV, e o parmetro message contm o texto a ser publicado nesta pgina.
J o mtodo enviarAvisoDeProgramacaoAosUsuarios() responsvel por enviar

os avisos sobre a programao a todos os usurios que registraram interesse no
programa criado, via Twitter e por meio de mensagens diretas. Este mtodo recupera
todos os usurios com interesse cadastrado e, para cada um, valida se a conta est
associada ao Twitter. Isto importante, pois uma conta de usurio pode estar
conectada a outra rede social diferente do Twitter. Esta validao feita na seguinte
expresso: "twitter".equals(usuarioASerAlertado.getProviderId()). Caso o
usurio encontrado possua conta vinculada com o Twitter, ento delegado ao
mtodo enviarMensagemViaRedeSocial() o envio do aviso. O cdigo responsvel
pelo envio do aviso por meio de uma mensagem direta via Twitter apresentado na
Listagem 13. O parmetro recipientId referente ao Id do usurio do Twitter ao
qual a mensagem ser enviada. Este valor foi recuperado da tabela userconnection,
coluna providerUserId.
Listagem 13. Trecho de cdigo responsvel por enviar o aviso sobre a programao
por mensagem direta via Twitter.
1 if(redeSocial instanceof Twitter){

2 ((Twitter)redeSocial).directMessageOperations().
3 sendDirectMessage(new Long(recipientId), message);
4 }
Testando a aplicao
Depois de toda a parte de codificao da SocialTV, chega a esperada hora de testar a
aplicao e aproveitar as funcionalidades e facilidades providas pelo Spring Social.
Primeiramente o leitor deve acessar a aplicao no papel de usurio do sistema

utilizando as credenciais pessoais que possui no Facebook. Depois do login, uma tela
parecida com a Figura 10 ser apresentada, mostrando as preferncias que o usurio
possui cadastradas no Facebook referentes msica, filmes e programas de TV.
Na tela da Figura 10, o link Vincular seu usurio ao twitter? deve ser clicado para a
criao do vnculo com a conta do Twitter pela qual o usurio receber os avisos da
programao. Aps a criao do vnculo com o Twitter, ao voltar pgina principal
(novamente na Figura 10), haver um boto com a opo Receber aviso sobre a
Programao SocialTV. Este boto responsvel por, de fato, registrar os interesses
do usurio na base de dados da SocialTV.
Com os interesses do leitor cadastrados na SocialTV no papel de usurio, pode-se
ento sair do sistema e executar os casos de teste do administrador. importante
que o leitor neste momento ou execute os testes do administrador em um browser
diferente ou ento acesse as pginas do Facebook e Twitter e efetue o logout dessas
aplicaes explicitamente.
Para acessar o sistema, utilize os dados do usurio administrador padro criado

anteriormente na Listagem 1. Antes de efetuar qualquer cadastro de programao,
necessria a criao dos vnculos com as contas corporativas da SocialTV, tanto para o
Facebook quanto para o Twitter. Criados os vnculos, acesse o link Incluir programa
na grade. Na tela apresentada, deve ser informado um nome de programa, canal, data
e horrio. Utilize um nome de programa ao qual o usurio utilizado no teste anterior
tenha cadastrado interesse. Finalmente, cruze os dedos e clique em Adicionar. Se tudo
ocorrer como esperado, um aviso como o mostrado na Figura 11 ser enviado para a
pgina corporativa da SocialTV e todos os usurios do Facebook que curtiram a pgina
recebero esta atualizao. A Figura 12 mostra uma mensagem direta enviada a um
usurio do Twitter pela SocialTV. Ressaltando que as mensagens diretas via Twitter s
sero enviadas para os usurios que sigam o perfil da SocialTV no Twitter.
Figura 10. Tela que apresenta as preferncias do usurio cadastradas no Facebook.
Figura 11. Aviso enviado para a pgina corporativa da SocialTV no Facebook.
Figura 12. Aviso enviado por mensagem direta via Twitter para usurio cadastrado.
Concluses
Atualmente as redes sociais tm grande importncia na vida das pessoas,
principalmente pelo grande poder de comunicao e interao que proporcionam. Estas
redes tambm comeam a despertar interesse de organizaes corporativas e
governamentais, que cada vez mais se dedicam em entender, utilizar e estudar os seus
efeitos.
Por isso, existe uma demanda crescente por profissionais de TI com domnio das
mdias sociais e que possuam um grande entendimento sobre a arquitetura e
funcionamento das redes sociais. Entre os desafios atribudos a estes profissionais
est a extrao de dados relevantes, gerenciamento da satisfao dos clientes,
campanhas de marketing, gerenciamento de marca, relacionamento com o cliente,
estudo de tendncias e comportamento. Enfim, so vrias as aplicaes e
possibilidades orbitando em torno destas redes.
A utilizao dos dados e servios disponveis nas redes sociais acontece por meio da
integrao com outras aplicaes, chamadas de aplicaes consumidoras. Estas
aplicaes se integram com as redes sociais para geralmente estender funcionalidades
ou criar novas funcionalidades no presentes nessas redes. No entanto, esta
integrao no simples, e por isso foi oferecido ao leitor uma opo bastante
poderosa na resoluo deste problema, o framework Spring Social.
As funcionalidades e facilidades providas por este framework foram apresentadas

atravs da criao de uma aplicao fictcia, que demonstra a integrao de um sistema
web com as redes sociais. Foram demonstradas tambm algumas das vantagens
obtidas com esta integrao.
Neste artigo finalizamos o desenvolvimento dos casos de uso apresentados na Edio

109 da Java Magazine e discutimos tambm a criao de perfis corporativos nas redes
sociais. Atravs do exemplo utilizado foram apresentados ao leitor os conceitos da
integrao das redes sociais com as demais aplicaes, a facilidade do uso do Spring
Social para isto e algumas das funcionalidades que esse tipo de integrao pode
prover. recomendado ao leitor a explorao da documentao das APIs do Facebook
e Twitter no Spring Social, dadas na seo Links, assim como a explorao das
diferentes redes sociais suportadas, como, por exemplo, o LinkedIn.
Links
Criao de pginas corporativas no Facebook.

http://www.facebook.com/pages/create.php
Criao de perfis no Twitter.

https://twitter.com/signup
Lista com as permisses de acesso para aplicaes do Facebook.

http://developers.facebook.com/docs/authentication/permissions/
Pgina corporativa da SocialTV no Twitter.

https://twitter.com/SocialTv9
Pgina corporativa da SocialTV no Facebook.

http://www.facebook.com/pages/SocialTV/419763004749300
Download do Tomcat.
http://tomcat.apache.org/index.html
Download do jQuery.
http://jquery.com/
Download do jQuery UI.

http://jqueryui.com/
Pgina do Spring Social.

http://www.springsource.org/spring-social
Pgina para download do banco de dados MySQL.

http://www.mysql.com
Pgina da API do Facebook no Spring Social.

http://static.springsource.org/spring-social-facebook/docs/1.0.x/api/
Pgina da API do Twitter no Spring Social.

http://static.springsource.org/spring-social-twitter/docs/1.0.x/api/
Edwins Leonardi
Ps-graduando do curso de Tecnologias Web da PUC-PR. Atualmente trabalha na IBM como IT Specialist. Atua h mais de
sete anos com desenvolvimento de sistemas Java. Possui as certificaes SCJP, SCWCD e SCBCD.
0 COMENTRIO
Ne nhum com e ntrio foi postado - se ja o prim e iro a com e ntar!
cursos relacionados posts em sequncia ltimos do autor
C urso online: Introduo ao desenvolvimento para celulares com J2ME
C urso online: Padres de Projeto em Java
C urso online - Desenvolvendo uma aplicao completa com Struts 2
Introduo ao Ruby on Rails
Administrao do Firebird/InterBase
[Ver todos]
DevMedia no Facebook
Curtir 5.546
5,546 pessoas curtiram DevMedia.
DevMedia | Anuncie | Fale conosco

Hospedagem web por Porta 80 Web Hosting
A lexandre Kelv in F ernando Jeser A ndr A manda M anuel Jos Digo Regiane
2013 - Todos os Dire itos R e se rvados a web-03 P lug-in social do F acebook

5-Integrando Aplicações Web Com As Redes Sociais - Revista Java Magazine 111

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

5-Integrando Aplicações Web Com As Redes Sociais - Revista Java Magazine 111

Uploaded by

Copyright:

Available Formats

10/01/13 Integrando aplicaes web com as redes sociais - Revista Java Magazine 111

revista Java Magazine

Integrando aplicaes web

favoritar marcar como lido inserir nota pessoal

Do que se trata o artigo:

Em que situao o tema til:

Integrando aplicaes web com as redes sociais:

As redes sociais possibilitam a criao de poderosos mecanismos de comunicao.

Esta forma de comunicao mais direta cria um estreitamento no relacionamento de

O exemplo apresentado a continuao do exemplo publicado na Java Magazine 109,

Recapitulando a aplicao web de exemplo

O Facebook e o Twitter sero utilizados como canais de interao com os

Figura 1. Casos de Uso da SocialTV.

A seguir feito o detalhamento dos casos de uso realizados pelo Administrador:

Vincula perfil do Twitter: os administradores necessitam vincular respectiva

Vincula perfil do Facebook: O administrador deve associar respectiva conta de

Cadastra programao da TV: O administrador cadastra a programao da TV

Criao das Pginas Corporativas nas Redes

Tambm importante que estas pginas ou perfis corporativos tenham a marca da

Figura 2. Logotipo da SocialTV.

Perfil Corporativo no Twitter

A classificao de um perfil do Twitter como corporativo feita de forma abstrata, por

Figura 3. Pgina corporativa da SocialTV no Twitter.

Pgina Corporativa no Facebook

O endereo para a criao de pginas no Facebook pode ser encontrado na seo

Negcios locais ou local;

Empresa, organizao ou instituio;

Artista, banda ou figura pblica;

Dentre os tipos disponveis o que mais se enquadrou no exemplo da SocialTV foi o

Figura 4. Pgina corporativa da SocialTV no Facebook.

Iniciando o desenvolvimento dos casos de

Estes casos de uso so inicializados quando o administrador efetua o login no sistema.

Listagem 1. Comando para criao de um usurio administrador no banco de dados.

1 insert into USER (DES_LOGIN, NME_USER, DES_PASSWORD)

Com a criao deste usurio no banco de dados, o acesso do administrador do

Em seguida, criaremos as pginas e a lgica para a interao dos administradores no

Listagem 2. Cdigo da pgina home.jsp.

1 <%@ page language="java" contentType="text/html;

A pgina home.jsp basicamente contm um menu com as opes de navegao que o

Tabela 1. Mapeamento entre casos de uso e URLs do sistema.

Podemos agora testar o login dos administradores do sistema atravs da inicializao

Figura 5. Tela home.jsp aps login do administrador.

Embora a tela exibida na Figura 5 apresente o caso de uso Cadastra programao da

Caso de uso Vincula perfil do Facebook

Os passos necessrios para o desenvolvimento deste caso de uso so idnticos aos

Resumindo novamente a criao de vnculos entre as redes sociais e as aplicaes

Tabela 2. Nomes e valores das variveis utilizadas pelo Spring Social.

Listagem 3. Cdigo da pgina facebookConnect.jsp.

1 <%@ taglib uri="http://java.sun.com/jsp/jstl/core"

Listagem 4. Cdigo da pgina facebookConnected.jsp.

1 <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

A pgina {provedor}Connect.jsp utilizada pelo controlador de conexes do Spring

A pgina {provedor}Connected.jsp, por sua vez, utilizada pelo controlador de

Para testarmos este caso de uso, devemos acessar a aplicao em

Figura 6. Pgina facebookConnect.jsp.

Figura 7. Tela de autorizao exibida ao usurio pelo Facebook para conceder o

Quando uma aplicao consumidora necessita de acessos que vo alm das

<input type="hidden" name="scope" value="publish_stream,manage_pages"/>

A nossa aplicao web utiliza os acessos chamados publish_stream e manage_pages,

Figura 8. Tela de autorizao exibida ao usurio pelo Facebook para conceder os

Finalmente, ao permitir o acesso ao aplicativo, o usurio redirecionado novamente

Caso de uso Cadastra programao da TV

telespectadores da TV sempre que um novo programa entra na grade de