Cadastro de usuários - Parte 1 - Studyxnet .Net & Xamarin
Cadastro de usuários – Autenticação com Redes Sociais
23 de março de 2015 5 de dezembro de 2015 Rafael Moura Xamarin, Xamarin Forms
Heeeeey Dev's
Que tal aprendermos um pouco de Xamarin.Forms e de quebra aprender a buscar os dados dos nossos usuários para adiantar no cadastro de algo? 😀
Vamos em passos então. Hoje vamos primeiramente aprender a configurar nossa aplicação para que ela possa fazer login no Facebook.
Como isso será possível? Iremos utilizar Autenticação oauth2, que é a forma como as API dessas duas redes, e muitas outras, funciona.
Dificuldade: Média Baixa (2/5)
O que vamos precisar nessa primeira etapa:
IDE, Smartphone Android (para testar a aplicação), acesso a internet e, claro, o Xamarin 😀
Usarei o Visual Studio, mas o Xamarin Studio tem todas as funcionalidades necessárias.
Criando os App's nas Redes Sociais para Cadastro
1) Acesse https://developers.facebook.com/
2)Add New App
3) Clique em Android
4) Coloque um nome (chamarei de appAutenticacaoXamarin) e Clique em Criar.
5) Na pop up deixe marcada "Não" para a pergunta sobre a App ser teste de uma outra já existente e escolha uma categoria qualquer. Clique em "Create App ID".
6) Vá ao fim da página, precisamos do nome do pacote e da Activy principal, coloque: "com.android.oauthXamarin" no PackageName e "com.android.oauthXamarin.MainActivity" em Defaul Activity Class Name. Clique em avançar.
7) Precisamos gerar nossa hash de desenvolvimento, acesse esse link: https://components.xamarin.com/gettingstarted/facebookandroid
8) Adicione as chaves geradas.
9) Clique em My Apps no menu, e clique no app que criamos.
10) Vá em Settings, Advanced e em "Valid OAuth redirect URIs" adicione "http://www.facebook.com/connect/login_success.html"
Criando a aplicação Xamarin
1) Abra o Visual Studio, vá em File => new => Project => Mobile Apps => Blank App (Xamarin.Forms Portable)
2) Dê o nome de "IntegracaoOauth"
3) Selecione o Local onde ira salvar, caso queira salvar em um local diferente do padrão do Visual Studio
4) Caso tenha um Host do Ios, conecte nele na pop up que apareceu, caso contrário clique em cancele
Configurando o App Android
1) Clique com o botão direito no projeto "IntegracaoOauth.Droid" e marque ele como o Start Up Project.
2) No projeto integracaoOatuh (Portable) existe a classe App.cs (provavelmente já está aberta na IDE). Deixe todos os métodos – inclusive o construtor – vazios.
3) No projeto Portable (passaremos a chamar de PCL), crie uma classe chamada ProfilePage, coloque ela como pública, faça ela herdar de BaseContentPage – a mesma não existe, crie ela.
4) Coloque a BaseContentPage como pública e faça ela herdar de ContentPage e escreva o método:
if (!App.IsLogged)
Navigation.PushModalAsync(new LoginPage()); /*A LoginPage não existe, crie a classe, coloque ela como publica e mande herdar de ContentPage */
5) No construtor da Profile Page coloque:
Text = "Pagina de Profile",
Teremos alguns erros, mas eles serão corrigidos nos passos a seguir
6) Na classe APP, faça o seguinte:
I) Adicione uma variável estática do tipo NavigationPage – colocarei o nome _NavPrincipal;
II) Crie o método GetMainPage estático do tipo Page
III) Crie o método estático to tipo bool chamado IsLogged
IV) Crie a propriedade estática do tipo string chamada _Token
V) Crie um método estático do tipo Action chamado LoginEfetuado
Teremos então as seguintes classes implementadas da seguinte forma:
7) No projeto IntegracaoOauth.Droid crie a classe LoginPageRenderer herdando de PageRenderer, vamos precisar adicionar os seguintes usings:
8) Adicione o componente Xamarin.Auth no projeto (Botão direito em componentes e procure por xamarin.auth, adicione ele ao projeto)
9) Na mesma classe criada, acima do nameSpace adicione o seguinte código:
[assembly: ExportRenderer(typeof(LoginPage), typeof(LoginPageRenderer))] e as devidas referencias. Após isso crie um override do método OnElementChanged e implemente ele com o seguinte:
10) Clique com o botão direito no projeto android e vá em propriedades, vá na opção Android Manifest da tela que abriu e preencha o campo "Package Name" com o nome que utilizou na app do facebook (no meu caso com.android.oauthXamarin) e nas Required permissions marque INTERNET, GET_ACCOUNT e USE_CREDENTIALS
11) Por fim, na Classe App.cs do projeto PCL, no método construtor adicione a linha:
MainPage = GetMainPage();
Execute o projeto, já podemos fazer Login no FaceBook com nossa aplicação.
No próximo post iremos aprender a utilizar a Facebook SDK
Cadastro de usuários – Autenticação com Redes Sociais 5.00/5 (100.00%) 3 votos
Android código fonte Facebook Forms Internet Network Oauth Permissions SDK Social xamarin XamarinForms
26 comentários em "Cadastro de usuários – Autenticação com Redes Sociais"
Pingback: SQLITE - Cadastro de Usuários - Studyxnet - Xamarin & .NET
Olá Rafael, parabéns pelos artigos, está me ajudando muito.
No posto de como fazer o login no facebook com xamarin, não tem o link no item 7:
7) Precisamos gerar nossa hash de desenvolvimento, acesse esse meu post para saber como:
Você pode me passar o link de como gerar o hash.
Olá André. Acesse esse link
https://components.xamarin.com/gettingstarted/facebookandroid
Aqui ensina a pegar a Hash Key
11 de novembro de 2015 às 11:45
Muito obrigado Rafel!!!
11 de novembro de 2015 às 12:00
A ferramenta keytool é instalada com o SDK do Android?
11 de novembro de 2015 às 12:03
Sim André. Basta acessar a pasta do sua SDK
11 de novembro de 2015 às 12:09
Na pasta C:\Users\andre\AppData\Local\Xamarin\Mono for Android existe o arquivo debug.keystore, porém quando executo o comando keytool -exportcert…. diz que o keytool não foi encontrado, já coloquei no path, reiniciei meu pc e nada. Vou ver o que pode ser. Muito obrigado pela ajuda amigo.
12 de novembro de 2015 às 09:54
Consegui gerar a chave, estou com um problema:
Error	The file "bin\Debug\MeuProjeto.Droid.dll.mdb" does not exist.	CarroDeOfertas.Droid
Quando vou rodar, acorre esse erro.
Sabe o que ode ser amigo?
Consegui resolver meu amigo! Obrigado pelo ótimo post!
12 de novembro de 2015 às 10:25
Qual era o problema? Como solucionou?
bom dia, o problema era na forma de usar o keytool, estava tentando chamar o comando diretamente do prompt, depois que vi que tinha que usar o openssl e dentro dele usar o comando keytool. Gerei a chave e o resto funcionou tudo.
23 de novembro de 2015 às 10:52
Eu estou precisando criar um formulário que autentique no facebook, no gmail e uma opção para autenticar no meu prorprio banco de dados. O usuário pode escolher uma das 3 opções. Você tem algum material para me indicar? Muito obrigado.
Você sabe me dizer como eu faço para debugar meu aplicativo?
Eu coloco o breakpoint, a aplicação executa normalmente, mas não para no breakpoint.
Já tentei limpar os arquivos temporarios na pasta do framework, etc…
Estou tentando colocar o breakpoint em um método que consome um WCF e preciso ver o retorno de uma lista.
Estou tentando debugar o que está dentro dessa chamada:
Quel é isso:
if (e.Result.descricaoOfertas != "") — Aqui que está meu BreakPoint
Opa André. Já deletou o app? Deleta toda das pastas Bin e OBJ do Projeto também. O breakpoint deveria parar. Uma coisa que você deve verificar é se ta habilitado o debug USB dentro do modo desenvolvedor do celular
Olá Rafel, primeiramente muito obrigado pelo retorno, agradeço imensamente.
Bom, eu deletei minha aplicação do device, apaguei as pastas Bin e Obj do Droid e Portable, e quando fui rodar, ocorreu o erro:
Error	The file "bin\Debug\ConsumidorInteligente.Droid.dll.mdb" does not exist.	ConsumidorInteligente.Droid
A opção de debug USB no celular, o que achei foi, Depuração USB que está habilitada, é essa?
Estou tentando resolver esse erro que deu agora depois que apaguei as pastas, está complicado.
Vou buscar e ver do que se trata. Após funcionar, na teoria, vai debugar.
4 de dezembro de 2015 às 10:41
O estranho é que mudei agora para o modo release e compilou e quando volto para debug, não compila.
Restautou a maquina? A IDE? Tentou recompilar?
4 de dezembro de 2015 às 10:57
Uhum, já fiz de tudo.
É re-gerada todas as dlls, menos a .mdb
7 de dezembro de 2015 às 15:22
Boa tarde Rafael, o problema era na licença do Xamarin, comprei uma Indie e agora funcionou. Deu tudo certo. Um pergunta, no método OnElementChanged que verifica se está autenticado (if (eventargs.IsAuthenticated)), como faço para pegar as informações de quem fez o login, tipo, nome, email, etc?
Você vai precisar utilizar a graph API no caso do facebook e ver as APIs dos outros.
16 de dezembro de 2015 às 07:45
Fala Rafael, está acontecendo uma coisa muito estranha, esse projeto de autenticação pelo facebook por exemplo, ainda não consegui debugar amigo. Agora se eu crio um projeto do zero, ele cria a ContentPage com a mensagem default do Xamarin "Welcome to Xamarin Forms!" e eu consigo debugar tranquilamente. Porém, nesse projeto não existe chamada assíncrona, e no projeto do facebook tem. Eu consigo mesmo assim debugar com chamadas assíncronas meu amigo? Pergunto pq já não sei mais o que fazer. E desenvolver sem usar os breakpoints demora demais. Forte abraço e obrigado por todas as respostas.
16 de dezembro de 2015 às 08:02
Acabei de fazer um teste: Retirando o método que possui Device.BeginInvokeOnMainThread(async () =>, o projeto é debugado normalmente. Eu fiz um mix, do projeto de autenticação do facebook, com o projeto de consumir WCF que você mostrou.
17 de fevereiro de 2016 às 18:49
Estou recebendo esse erro no facebook.
There was a problem verifying the package name com.android.oauthXamarin on Google Play. Please check the package name and try again.