Inclua o logon único e o SkyDrive nos seus aplicativos do Windows 8 com o Live SDK

Blog do desenvolvedor de aplicativos do Windows 8

Ideias sobre a criação de aplicativos com o estilo Metro para o Windows 8, da equipe de engenharia do Windows 8

Inclua o logon único e o SkyDrive nos seus aplicativos do Windows 8 com o Live SDK

  • Comments 0

Graças à nuvem, os clientes do Windows 8 podem trabalhar e se divertir diretamente em todos os dispositivos. Entrando no seu PC ou dispositivo com uma conta da Microsoft e usufruindo o armazenamento pessoal gratuito no SkyDrive (consulte Conectando seus aplicativos, arquivos, PCs e dispositivos à nuvem com o SkyDrive e o Windows 8 para obter mais informações), os seus aplicativos, configurações e arquivos pessoais ficam sempre com você. Como desenvolvedor de aplicativos, você pode usufruir essas funcionalidades na nuvem fazendo uma integração com o Live SDK em seus aplicativos estilo Metro.

O Live SDK oferece um conjunto de controles e APIs que habilitam os aplicativos para que integrem o SSO (logon único) com contas da Microsoft e acessem informações do SkyDrive, Hotmail e Messenger no Consumer Preview. Há também um SDK correspondente para Windows Phone, que oferece um conjunto semelhante de funcionalidades.

Aprendendo a usar o Live SDK

Primeiro, você precisará instalar o Windows 8 Consumer Preview ,Visual Studio 11 Beta e o Live SDK Developer Preview no PC, se ainda não tiver feito isso. Depois, visite o site de gerenciamento de aplicativos do Live Connect para configurar o seu aplicativo estilo Metro para que acesse os nossos serviços na nuvem.

Depois de configurar o aplicativo, você precisará adicionar uma referência ao Live SDK. O Live SDK está disponível para desenvolvimento em C#, JavaScript e Visual Basic. O Live SDK não dá suporte a C++ no momento, mas você pode baixar um exemplo de código completo, SkypadCpp, que mostra como acessar o SkyDrive de um aplicativo em C++.

Para adicionar o Live SDK ao seu projeto, clique com o botão direito do mouse no Projeto e selecione [Add Reference](Adicionar Referência) > [Extension SDKs] (SDKs de Extensão) > a entrada do Live SDK.

Em um aplicativo JavaScript, basta adicionar esta referência de script ao default.html:

<script type="text/javascript" src="ms-appx:///LiveSDKHTML//js/wl.js"></script>

Em C#, adicione esta referência:

using Microsoft.Live;

E, no Visual Basic, basta adicionar a instrução de importação:

Imports Microsoft.Live

Paradoxo do logon único e entrada fácil

Um dos principais benefícios que os aplicativos recebem com a integração com o Live SDK, é a capacidade de habilitar o SSO (logon único) com as contas da Microsoft. Um dos maiores desafios para os aplicativos é que os usuários não gostam quando são solicitados a se inscrever em novas contas ou a entrar em aplicativos e sites repetidamente. Mas quando um usuário entra em um aplicativo ou site, ele usufrui uma experiência do usuário muito mais aprimorada porque, conhecendo o usuário, o aplicativo pode ser personalizado para o comportamento e necessidades específicas dele. A contradição fundamental de os usuários não gostarem de realizar uma tarefa que aperfeiçoa muito sua experiência é chamada de paradoxo da entrada fácil.

Os sites e aplicativos estilo Metro da Microsoft evitam esse paradoxo no Windows 8 porque os usuários desse sistema operacional entram em seus PCs usando a conta da Microsoft. Os aplicativos da Microsoft, como Contatos, Email e Mensagens, e sites da Microsoft, como o Hotmail usam as contas da Microsoft para que os usuários não precisem entrar neles depois de terem entrado no PC. É a chamada experiência de entrada sem cliques.

Os seus aplicativos e sites também podem usar as contas da Microsoft para proporcionar uma experiência de entrada sem cliques usando o Live SDK. Mas lembre-se de que o usuário terá de conceder permissão ao seu aplicativo uma vez para que ele acesse sua identidade.

Mesmo que já possua um sistema de contas de usuários, você poderá conectar o seu sistema de identidade às contas da Microsoft para criar experiências de entrada direta para os seus usuários. Isso fica ainda melhor se você possuir um site e um aplicativo estilo Metro. Quando o usuário se conectar ao seu aplicativo, não terá de entrar no site novamente e vice-versa, contanto que ele tenha entrado no PC com uma conta da Microsoft.

Um princípio do Live SDK é que você escreve o mesmo código para criar um aplicativo Web ou um aplicativo do Windows 8. Isso significa que o código JavaScript usado pelo usuário para entrar e acessar suas informações de perfil é o mesmo dos seus aplicativos estilo Metro escritos com JavaScript e de sites que usam o Live SDK para sites. O próximo trecho de código funciona com modificação mínima na Web ou em um aplicativo estilo Metro. A diferença entre o código de aplicativos estilo Metro e Web é que a chamada do WL.init exige que uma ID de cliente seja especificada na Web e, no Windows 8, esse valor é automaticamente obtido pelo identificador do aplicativo atual fornecido pelo sistema operacional.

WL.init();
WL.getLoginStatus().then(function (response) {
onSessionChange(response);
});

function onSessionChange(response) {
var session = WL.getSession();
if (!session) {
WL.Event.subscribe("auth.login", onLoginComplete);
WL.ui({
name: "signin",
element: "signinbutton",
scope: ["wl.signin", "wl.skydrive"],
});
}
else {
greetUser();
}
}

function onLoginComplete() {
var session = WL.getSession();
if (!session.error) {
greetUser();
}
};

function greetUser() {
WL.api({
path: "/me",
method: "get"
}
).then(
function (result) {
document.getElementById("meName").innerText = "Welcome, " + result.name;
getUserPicture ();
});;
};

function getUserPicture() {
var session = WL.getSession();
var LiveConnectAPIUrl = "https://apis.live.net/v5.0";
document.getElementById("meImg").src = LiveConnectAPIUrl +
"/me/picture?return_ssl_resources=true&access_token=" + session.access_token;
document.getElementById("meImg").style.visibility = "visible";
};
;

Esse exemplo de código verifica se o usuário está conectado na conta da Microsoft no momento e, se estiver, cumprimenta o usuário. No Windows 8, esse código verifica se o usuário está conectado a um PC e, na Web, ele verifica se o usuário está conectado em algum site que dê suporte às contas da Microsoft, como o Hotmail ou SkyDrive. Se o usuário não estiver conectado, o exemplo cria um botão de entrada que solicita ao usuário permissão para o aplicativo conectá-lo (WL.signin) e acesso de leitura a seu SkyDrive (WL.skydrive). Quando o usuário clica no botão, ele é solicitado a entrar, caso não esteja conectado a seu PC com uma conta da Microsoft. Depois disso, ele deve autorizar o acesso a suas informações pessoais pelo aplicativo. Após a confirmação das informações, os métodos greetUser() e getUserPicture() permitem que o aplicativo acesse o nome e a imagem para exibição do usuário.

Como você pode ver, a integração com o Live SDK facilita, para os aplicativos que não possuem um sistema de contas de usuários, a integração direta com contas da Microsoft. Além disso, os aplicativos que possuem seu próprio sistema de identidade podem inicializar o processo de inscrição usando as informações da conta da Microsoft do usuário.

Levando a nuvem pessoal aos seus aplicativos com o SkyDrive e o Hotmail

No Windows 8, os usuários podem interagir com seus arquivos no SkyDrive ou com seus contatos no Hotmail, usando os aplicativos estilo Metro Contatos e SkyDrive. Os dois aplicativos facilitam sua integração com outros aplicativos estilo Metro de forma livre sendo provedores de dados.

O aplicativo estilo Metro SkyDrive funciona como provedor para o seletor de arquivos, o que significa que todo aplicativo que usar o seletor de arquivos também terá o SkyDrive como um local para salvar e abrir arquivos, contanto que o aplicativo estilo Metro SkyDrive esteja instalado. Da mesma forma, o aplicativo Contatos é um provedor do seletor de contatos e pode funcionar como fonte para os aplicativos que precisarem selecionar um ou mais contatos do usuário.

A obtenção de dados pelos seletores é a maneira de se ter um único acesso aos dados do usuário na nuvem, onde você não precisar de uma integração total dos dados da nuvem no seu aplicativo. Em outros casos, por exemplo, se o seu aplicativo oferecer uma experiência personalizada com todos os arquivos de um determinado tipo no SkyDrive do usuário, você precisará da integração com o Live SDK.

Assim como o mesmo código JavaScript do Live SDK funciona em um site ou aplicativo estilo Metro do Windows escrito com JavaScript, a mesma regra se aplica a aplicativos escritos em XAML direcionados tanto para o Windows Phone quanto para o Windows 8. O trecho de código a seguir funciona na maioria das vezes sem modificação nas duas plataformas, com a exceção de duas diferenças principais. A primeira é que, como ocorre com o exemplo do JavaScript, é necessário especificar a ID do cliente na versão do Windows Phone do código, o que é determinado automaticamente no Windows 8. A segunda diferença é que, para criar métodos assíncronos no Windows Phone, você precisa usar o Visual Studio Async CTP.

Botão de entrada em XAML

<Controls:SignInButton x:Name="btnSignIn" Content="SignInButton" HorizontalAlignment="Right"
Height="46" Margin="-1,0,6,0" Width="157" Scopes="wl.signin wl.skydrive"
SessionChanged="btnSignIn_SessionChanged" Visibility="Collapsed" />

Code behind em C#

private void btnSignIn_SessionChanged(object sender, 
Microsoft.Live.Controls.LiveConnectSessionChangedEventArgs e)
{
if (e.Status == LiveConnectSessionStatus.Connected)
{
App.Session = e.Session;
LoadPhotos();
}else
{
btnSignIn.Visibility = Windows.UI.Xaml.Visibility.Visible;
}

}

internal async void LoadPhotos ()
{
LiveConnectClient client = new LiveConnectClient(App.Session);
LiveOperationResult albumOperationResult = await client.Get("me/albums");
dynamic albumResult = albumOperationResult.Result;
foreach (dynamic album in albumResult.data)
{
var group = new SkyDriveAlbum(album.id, album.name, album.name, @"ms-
appx:///Assets/DarkGray.png"
, album.description);
LiveOperationResult pictureOperationResult = await client.Get(album.id + "/files");
dynamic pictureResult = pictureOperationResult.Result;
foreach (dynamic picture in pictureResult.data)
{
var pictureItem = new SkyDriveFileItem(picture.id, picture.name,
picture.name, picture.source, picture.description, picture.description, group);
group.Items.Add(pictureItem);
}
this.ItemGroups.Add(group);
}

}

Esse trecho de código cria o botão de entrada e, se o usuário conceder ao aplicativo permissão de acesso a seus dados, ele recupera metadados dos álbuns de fotos do usuário no SkyDrive. Você pode escrever código semelhante para acessar os contatos e calendários do usuário no Hotmail.

Exemplos de código

Você pode baixar o código completo desta postagem no repositório de exemplo do Live SDK no GitHub. Esse repositório também contém exemplos de código para a interação com o Live SDK de várias outras plataformas.

Próximas etapas

Mostrei como os aplicativos podem usar o Live SDK para criar uma integração direta com a nuvem usando as mesmas tecnologias dos próprios aplicativos estilo Metro da Microsoft. Há uma imensa quantidade de integrações possíveis com o Live SDK no seu aplicativo. Além de aperfeiçoar as experiências de inscrição e de entrada do seu aplicativo, você pode:

  • Criar aplicativos que usufruam o armazenamento gratuito do SkyDrive para armazenar ou acessar o conteúdo do usuário criado no seu aplicativo
  • Manter a integração do usuário com o seu aplicativo adicionando eventos a seu calendário, o que os faz retornar ao seu aplicativo ou site
  • Localizar os contatos do usuário no Hotmail que também usem o seu aplicativo
  • Criar experiências de compartilhamento em tempo real com a rede do Windows Live Messenger

Para saber mais sobre o Live SDK, leia a nossa documentação, baixe o Live SDK e faça perguntas nos nossos fóruns.

--Dare Obasanjo
 gerente geral de programas sênior, plataforma Live Connect

  • Loading...
Leave a Comment
  • Please add 8 and 4 and type the answer here:
  • Post