Hoje, gostaria de anunciar que consegui dedicar uma parte das minhas madrugadas desenvolvendo e ajudando um projeto opensource, que consegue se conectar ao Orkut. Para quem já conhece Opensocial, sabe que é possível desenvolver aplicativos para redes sociais e fazê-los rodar lá dentro. Mas e caso você queira fazer uso da rede social para promover seu aplicativo/site, sem ter necessariamente que produzir um aplicativo Opensocial ?

O Facebook, por exemplo, permite tal interação através do Facebook Connect, que é basicamente um conjunto de APIs para interagir com a rede, ex: mudar mensagem de status, postar mensagens no mural, buscar amigos, etc …

Até pouco tempo atrás, a única forma de interagir com o Orkut sem estar necessariamente logado dentro da rede, era usando o 2-legged OAuth que foi disponibilizado a partir da versão 0.8 do Opensocial via REST ou RPC - em poucas palavras, para ter acesso às informações do usuário por fora da rede social, o usuário deve ter um aplicativo seu escrito em Opensocial instalado no perfil. Como parte dos inúmeros processos de melhoria, o time do Orkut desenvolveu um projeto, chamado Orkut-os-client – baseado em 3legged OAuth, e que permite fazer acesso as informações dos usuários dentro do Orkut sem precisar de nenhum aplicativo instalado no perfil.

Mas nem tudo é uma maravilha: A API foi desenvolvida em Java, sendo que a grande maioria das pessoas usam PHP para o desenvolvimento. Depois de um certo tempo lendo usuários solicitando a API em outras linguagens, decidi migrar parte do código para a linguagem PHP, e pesquisando, consegui fazer algo simples e rápido.

A pergunta que você pode estar fazendo é “como simples e rápido” ? Bom, primeiro dei uma lida geral no código fonte da API em Java e descobri que todo o processo é um RPC Wrapper, e que as chamadas dos métodos da rede social são exatamente as mesmas usadas no Opensocial, ex: “messages.get” .

Com base nisso, fiz download da API já existente – desenvolvida pelos caras da Google, chamada opensocial-php-client -  que possui implementação de 2-legged e 3-legged para uma grande parte das redes sociais.

Apliquei um patch, modificando as url’s de access token, além de alterar as chamadas JSON que são feitas ao servidor de RPC, e funcionou muito bem. Já há uma versão rodando que permite ler e gravar SCRAPS, além de pegar informações dos seus amigos.

Continuo trabalhando para dar suporte às outras funcionalidades: Álbum, activities, e outros.

O projeto foi disponibilizado no GoogleCode, e criei uma lista de discussão para os interessados no desenvolvimento. Caso queira participar, sua contribuição é bem vinda.

Site do projeto, no Google Code: Orkut-os-client-php

Grupo de discussão sobre a biblioteca

Enjoy!

Robson Dantas

Bookmarks

Veja o plugin Opensocial para Firefox/Firebug.

Não sabe o que é Firebug ? Dê uma olhada por aqui.

.

Parabéns Arne Kurrik pelo ferramenta!

.

Abraços,

Robson Dantas, Opensocial Guru

Bookmarks

O domínio está criado: http://www.opensocial-br.org , twitter opensocial_br e e-mail do grupo opensocial-br@googlegroups.com .

Se você é um entusiasta e gosta de Opensocial e desenvolvimento para redes sociais, é sua chance de participar e fazer parte de um grupo composto por feras.

Além disso, vamos estudar diversas tecnologias Google para suportar todo desenvolvimento.

PS: Já que as pessoas gostam de “repostar” o que escrevo, acho que essa é sua chance, certo GoogleDiscovery ? Ajude-nos a divulgar essa idéia.

Bookmarks

Para os que não lembram, ou não sabem, vários aplicativos usando Opensocial no Orkut foram atacados, tanto usando técnicas de phishing, quanto por injeção arbitrária de html.

Nesse novo modelo, a renderização é feita pelo servidor, bem como o modelo de recebimento de dados. O Orkut promete que haverá uma redução razoável de round-trips, coisa que enchia e muito o saco no antigo modelo de desenvolvimento. A latência da aplicação ficava bem alta.

Como nem tudo é um mar de rosas, desenvolver aplicações nesse novo modelo, além de engessar (não vou falar que engessa um pouco, pois dificulta bastante), diminui um pouco do poder de interatividade na visão “profile”. Para o canvas ainda é possível codificar direto, via javascript.

Veja a matéra na íntegra: Profile views are back!

Bookmarks

Agora é necessário que as requisições incluam no header application/json ao invés de content-type/x-www-form-urlencoded.

Além disso, há uma nova forma para assinar os requests (signed request), usando um mecanismo chamado “body hash”. Essa especificação está disponível em http://oauth.googlecode.com/svn/spec/ext/body_hash/1.0/drafts/1/spec.html .

Mais detalhes sobre a implementação no blog do opensocial.

abs

Robson Dantas
Opensocial Guru

Bookmarks

Para deixar claro o que é o signed request, vamos usar um exemplo bem básico:

• Você possui um aplicativo Opensocial rodando no Orkut que envia requisições HTTP para seu servidor;
• O seu servidor trata a requisição e salva alguns dados no banco de dados;
• Algum momento depois, o seu aplicativo requisita os dados e sua aplicação codifica e transmite de volta;
• Você quer garantir que somente o Orkut envie requisições HTTP ( get ou post), garantindo que ninguém manipule os dados, usando um formulário de mentira ou até modificando os parâmetros via Firebug, por exemplo;

O último tópico é a chave de tudo. Pois bem, como garantir essa segurança ? Pensando nesse problema, os containers implementaram um modelo baseado no OAuth. Se você nunca ouviu falar de OAuth, sugiro que vá até o site e dê uma olhada – http://www.oauth.net.

De uma visão bem macro, o container (Orkut, Hi5, MySpace, etc), criptografa os dados, transmite alguns parâmetros através do cabeçalho HTTP e o servidor final, deve ser capaz de decriptografar a mensagem e receber o request. Caso isso não aconteça, o request não é válido e a mensagem não chega ao destino.

Gostaria de deixar claro que isso não é SSL (secure socket layer). É apenas um protocolo para ser usado sob HTTP para melhorar a segurança. Utiliza alguns dos mecanismos de criptografia do SSL, mas não da mesma forma.

Continuando…

Se você, da mesma forma que eu, gosta de um pouco de teoria, sugiro acessar o site do OAuth e entender um pouco mais como funciona. Muita gente prefere ir direto ao código, portanto vou procurar ser um pouco objetivo aqui.

Para implementar requests assinados no Orkut, primeiramente você precisa baixar a chave pública disponibilizada por eles mesmos. Dessa forma garantimos que conseguimos decriptar a mensagem enviada pelo servidor. Você pode baixar por aqui .

Caso queira a lista completa de todos os certificados, use esse blog do Opensocial Resources que a fonte é confiável. https://opensocialresources.appspot.com/certificates/

Depois disso, basta implementar uma receita de bolo. Praticamente todas as linguagens oferecem suporte ao OAuth e eu já implementei tranquilamente usando PHP, .NET e Java. Especificamente para PHP tenho código fonte pronto que vou disponibilizar aqui. Não é nada muito sofisticado, mas dá pra você implementar algo por cima.

1- Implementando um request simples pelo Opensocial. Estou supondo que você saiba como é criar o app.xml e como chamar pelo menos a função init:

function criaSignedRequest()
{

var postdata = {acao: “retornaJson”}; // post campo chamado acao
postdata = gadgets.io.encodeValues(postdata);

var params = {};
// linha abaixo determina que o request é do tipo SIGNED.
params[gadgets.io.RequestParameters.AUTHORIZATION] = gadgets.io.AuthorizationType.SIGNED;
params[gadgets.io.RequestParameters.METHOD] = gadgets.io.MethodType.POST;
params[gadgets.io.RequestParameters.POST_DATA]= postdata;

// envia o request
gadgets.io.makeRequest(‘http://www.meusite.com/acao.php’, onCallback,params);
}

function onCallback(ret)
{
//retorna um json convertido para array
var retorno = gadgets.json.parse(gadgets.util.unescapeString(ret.data));

if(retorno!=null)
{
alert(retorno['mensagem']); // deve imprimir Ola mundo
}

}

2 – Implementando do lado do PHP

Não vou entrar nos detalhes da implementação do OAuth. Simplesmente baixei uma API pronta, disponibilizada pela própria Google e realizei as alterações necessárias para meu código funcionar.

Mais detalhes do projeto OAuth em PHP você pode ver aqui: http://code.google.com/p/oauth/

<?php
require_once(“verifica_certificado.php”);

// verifica se o certificado veio correto.
if($payload["auth"]==”OK”)
{
$acao = $_POST["acao"]; // recebe o post chamado acao definido no javascript

if($acao==”retornaJson”)
{
$retorno = Array();
$retorno["mensagem"]=”Ola mundo”;

// essa funcao faz a magica de converter um array php em um json que irá virar código javascript
echo json_encode($retorno);

}
}

?>

Nota: $payload["auth"] é o retorno que está em verifica_certificado.php . Dê uma avaliada no código, que por sinal é bem simples. Brinque também com o Firebug para ver os requests sendo enviados e o retorno do mesmo.

Baixe os códigos necessários para fazer a aplicação rodar (verifica_certificado.php, disable_magic_quotes.php, CertFileAccessor.php, OAuth.php).

Espero ter clareado um pouco e mostrar como é simples. Além disso, não deixe de visitar a wiki do Opensocial sobre Signed Requests que está bem detalhada e possui exemplo em Java. http://wiki.opensocial.org/index.php?title=Validating_Signed_Requests

Tem dúvida ? Poste aqui no Blog.

-Robson Dantas, PMP, Opensocial Guru

Bookmarks

Além disso, meu primeiro aplicativo, desenvolvido em conjunto com a Abril Digital, está bombando no Orkut. Se você não conhece ainda, basta adicionar: “Meu time, meu humor”. É um widget bem legal, onde você pode acompanhar pelo seu perfil o resultado do último jogo do seu time, notícias de futebol, tabela, classificação, tudo conectado diretamente com o site da Placar.

meu time, meu humor

Fique atento na seção de opensocial do blog, todo dia tem sempre alguma novidade aparecendo.

-Robson

Bookmarks

• Validando signed requests em PHP usando OAUTH e containers como orkut, hi5 e myspace;
• Comunicação entre widget e aplicativo server side usando opensocial, javascript, php e json;

Olá!

Após alguns dias sem escrever, resolvi voltar ao assunto do Opensocial e postar alguns detalhes importantes sobre como construir uma aplicação e transferir dados entre o widget e uma aplicação server-side, no caso, escrita em PHP.

Recebo várias questões por e-mail sobre qual tecnologia utilizar e o que costumo dizer é: “A que você melhor souber”. O processo de comunicação é simples, já que todo o tráfego de dados é feito através de requisições de POST e GET,  e além disso, todo o mecanismo de segurança da aplicação, já está criado nas mais diversas linguagens (estou me referindo aos signed-requests ou requisições seguras).

Introdução:

Se você nunca ouviu falar a respeito dos signed-requests, vou definir em poucas palavras e deixar uma referência do próprio Opensocial para que você possa ver os códigos e implementar.

Imaginemos o seguinte cenário:

• O aplicativo opensocial (widget), precisa mandar alguns dados para o servidor xyz.com através de um formulário;
• O servidor xyz.com deseja aceitar somente requisições que sejam dos servidores do container (Orkut, Hi5, Myspace, etc), garantindo que alguém não possa forjar a transferência dos dados;

Como fazer isso ? Simples:

Você precisa de um certificado (uma chave que garante que seu server consiga descobrir que o outro lado é o container) e precisa saber decriptar a mensagem de autenticação. Todo processo de autenticação é realizado através de um protocolo chamado OAUTH, que está descrito no site oauth.net . Procure as bibliotecas nos sites de busca, pois a maioria das linguagens já possuem APIs prontas para trabalhar com o protocolo; seja esperto e não tente reinventar a roda .

Depois disso, você só precisa implementar uma rotina genérica para validar todo o processo de request. Simples, não ? Caso precise de mais detalhes, dê uma verificada no site do Opensocial, onde estão disponíveis exemplos em PHP e Java.

http://wiki.opensocial.org/index.php?title=Validating_Signed_Requests

Postando dados – PHP – JSON e Opensocial

Enfim, agora que você já “sabe” como tornar seu aplicativo seguro, vamos ao que interessa: realizar transferência de dados entre o container e seu aplicativo, escrito em PHP.

Antes de começar, vou definir aqui o que é o JSON: Nada, além de javascript serializado em uma string. Isso mesmo, javascript serializado em string. Em php existem duas funções básicas para trabalhar com ele:

json_encode(msg) e json_decode(msg). Só para deixar claro, um array $msg["a"]=”abc” e $msg["b"]=”xyz”, ao passar por json_encode($msg), retornaria {“a”:”abc”,”b”:”xyz”}. Ou seja, um array javascript ; continuando…

O opensocial fornece uma api de IO que encapsula todo o processo de transferência de dados e você não precisa se preocupar se usa AJAX, XMLHTTP ou qualquer outra coisa. Além disso, também não precisa se preocupar com problemas de requests em domínios diferentes e de problemas de segurança nessas transações pois a API trata, usando um mecanismo de proxy.

Vamos imaginar um cenário, onde você queira cadastrar dados de um usuário do seu widget, no Orkut por exemplo, salvando em um banco de dados mySQL, com rotinas escritas em PHP.

app.xml exemplo:

<?xml version=”1.0″ encoding=”UTF-8″?>
<Module>
<ModulePrefs title=”Meu cadastro”
description=”Meu aplicativo teste”
author_email=”blogdodantas@dxs.com.br”
author_location=”Sao Paulo, Brazil”>
<Require feature=”opensocial-0.7″/>
<Require feature=”dynamic-height” />
<Require feature=”setprefs”/>
<Require feature=”views” />
</ModulePrefs>
<Content type=”html”>
<![CDATA[
<script language="javascript">

// somente exemplo para lidar com layers
function init()
{
     var cabecalho = document.getElementById("cabecalho");

     if(cabecalho!=null)
          cabecalho.innerHTML="<center>Meu cabeçalho !!</center>";
}

// funcao usada para mandar dados ao servidor
function gravaDados()
{
          // array de parametros para a api
          var params = {};

          var formulario = document.getElementById("frm");
          var nome="";
          var email="";

     if(formulario!=null)
     {
          nome = formulario.nome.value;
          email = formulario.email.value;

          // array de dados do post
          postdata = {
          nomeUsuario: nome,
          emailUsuario: email
          }

          // codifica os dados do post
          postdata = gadgets.io.encodeValues(postdata);

          // adiciona os parametros
          params[gadgets.io.RequestParameters.AUTHORIZATION] = gadgets.io.AuthorizationType.SIGNED;
          params[gadgets.io.RequestParameters.METHOD] = gadgets.io.MethodType.POST;
          params[gadgets.io.RequestParameters.POST_DATA]= postdata;

          // define url de destino do post
          var url = “http://www.meuservidor.com.br/gravadados.php”;

          // executa o post para url, com o callback chamado onResposta, passando params
          gadgets.io.makeRequest(url, onResposta, params);
     }
}

// funcao executada quando o post for enviado
function onResposta(ret)
{
     var dados = ret.data;

     // verifica o retorno do post, json é transformado em array no PHP
     if(dados!=null)
     {
          // transforma a string em um array. Função nativa
          dados = gadgets.json.parse(gadgets.util.unescapeString(dados));

          if(dados["mensagem"]==”ok”)
          {
               alert(“Dados gravados com sucesso”);
          }
     }
     else
     {
          alert(“Não foi possível gravar”);
     }
}

</script>
<script>
gadgets.util.registerOnLoadHandler(init);
</script>

<div id=”cabecalho”></div>

<form id=”frm”>
Nome: <input type=”text” name=”nome” id=”nome”><br/>
E-mail: <input type=”text” name=”email” id=”email”><br/>
<input type=”button” value=”Cadastrar” onclick=”gravaDados()”>
</form>
]]>
</Content>
</Module>

Este simples app.xml envia um post para uma página chamada gravadados.php. A página gravadados.php deve tratar o post, salvar no banco e retornar uma string json para que o javascript trate de volta.

Um exemplo básico desse arquivo, poderia ser:

<?php
// gravadados.php – exemplo – fictício
// blogdodantas.dxs.com.br

// arquivo que verifica certificado do orkut
require_once(“verifica_certificado.php”);

$msgRetorno["msg"] = “”;

// verifica se o certificado veio correto.
if($payload["auth"]==”OK”)
{
     // abrir conexao com banco, etc..

     // post enviado pelo javascript – opensocial
     $nome = $_POST["nomeUsuario"];
     $email = $_POST["emailUsuario"];

     $sql = “INSERT INTO tabela(nome, email) values(‘”.$nome.”‘,’”.$email.”‘)”;
     mysql_query($sql);

     $msgRetorno["msg"]=”ok”;

}
else
{
     $msgRetorno["msg"]=”Problema autenticando”;
}

// funcao mágica para retornar json com php
echo json_encode($msgRetorno);

?>

Tranquilo, não ?

Apesar de simples, espero ter ajudado a desvendar esse mistério de transmissão de dados. Uma dica legal é usar o firebug, no firefox. Você consegue debugar toda a transmissão de dados e verificar os post’s sendo transmitidos.

Além disso, não deixe de consultar a wiki do opensocial. Eu mesmo escrevo algumas coisas e tem muita informação interessante.

http://wiki.opensocial.org

Até mais!

-Robson
Especialista em Opensocial| Opensocial guru

Bookmarks

Oficialmente, sou um membro do Opensocial Foundation ! E o que isso tem de bom ? Muita coisa, como por exemplo acesso à algumas novidades, participar ativamente do processo de desenvolvimento de especificação, votar por mudanças, etc, etc…

Se você, da mesma forma que eu, vê no Opensocial uma enorme oportunidade de fazer negócios, criar aplicativos interessantes e apenas se divertir com javavascript, html e outras coisas, embarque na idéia.

Grupo de discussão e fórum do Opensocial:
http://groups.google.com/group/opensocial?pli=1

Tem algum comentário ou sugestão ? Expresse aqui!

Bookmarks

Somente para lembrar: O Opensocial não é do Google. É uma especificação aberta, implementada por uma série de redes sociais, onde alguns players dão ajudas fundamentais para o andamento do processo, entre eles Google e Yahoo. Se você quer ver o que está rolando por trás disso, entre na lista de discussão do assunto e contribua de qualquer forma.

Você já deve ter ouvido falar de AdSense, Uol Anúncios e assim por diante, certo ? Com certeza sabe que você ganha dinheiro com cliques gerados nesses anúncios e que a equação de clique x dinheiro depende basicamente do número de acessos – tráfego propriamente dito. Agora imagine você com um aplicativo desenvolvido e com mais de 2milhões de instalações, imagine o volume de pageviews que você geraria ?

Pois bem, esse é o principal motivo pelo qual vários desenvolvedores estão correndo para criar aplicativos e aplicar idéias que possam gerar interatividade e ao mesmo tempo dinheiro $$$. Veja o caso do BuddyPoke, um dos widgets mais famosos do Orkut a quantidade de anúncios que ele exibe.

Os portais também estão doidos atrás de widgets, brigando pela eterna rivalidade de audiência.  Animou-se ? Então mãos à obra, coloque sua cabeça para funcionar, mexa os dedos e crie algo interessante. Quem sabe você não faz um dinheirinho extra com pouco esforço ?

Boas idéias sempre surgem de boas oportunidades.

Gostou ? Comente.

Bookmarks