Como fazer login na minha aplicação utilizando o Facebook? Quais as possíveis formas de fazer isso?
Sem mais enrolação, vamos ao passo-a-passo!
Existem duas formas de você fazer login na sua aplicação utilizando o Facebook. A primeira, utilizando a classe LoginButton que fornece um componente de botão para você incluir na sua tela e a segunda é utilizando a classe LoginManager que não disponibiliza componentes visuais.
Como pré-requisito você precisa ter:
* Facebook App configurado e lincado à sua aplicação;
* Facebook SDK adicionado à sua aplicação;
* Facebook App ID configurado e lincado à sua aplicação;
* Android Key Hash configurado e adicionado ao seu perfil de desenvolvedor;
* Facebook Activity incluso ao seu arquivo AndroidManifest.xml.
Calma, não se desespere ainda! Iremos fazer tudo isso passo-a-passo!
1) Pré-requesitos
1.1) Faça login no site do Facebook para desenvolvedores com sua conta do Facebook.
1.2) Na aba "My Apps" clique em Register as a Developer como mostra a figura abaixo:
A seguinte janela irá abrir. Aceite os termos e clique em cadastre-se:
1.3) Na tela que irá abrir, selecione Android, digite o nome da sua aplicação e clique em Create New Facebook App ID.
Na próxima tela escolha a categoria da sua aplicação e prossiga.
Faça o download do Facebook SDK for Android e guarde-o, iremos utilizá-lo nas próximas sessões.
No fim da página você precisará informar o pacote e a Activity principal da sua aplicação. O package você irá recuperar do arquivo AndroidManifest.xml na sua aplicação. Para o campo da Activity usaremos o caminho completo da Activity que é executada ao abrir sua aplicação. Segue imagens.
Clique em Avançar.
1.4) No próximo passo iremos gerar o Android Key Hash. Não é uma tarefa difícil, apenas execute o seguinte comando:
MAC:
WINDOWS:
Se ao executar o comando você se deparar com o erro "'openssl' is not recognized as an internal or external command, operable program or batch file." faça o download do openssl aqui, instale-o e execute o comando novamente substituindo "openssl" pelo caminho de instalação do mesmo. Desta forma:
Caso seja solicitado alguma senha apenas dê enter. Copie o código base64 que é mostrado para a area do cadastro Facebook Developers que pede o código Hash
Clique em Avançar.
1.5) Vamos importar o Facebook SDK que baixamos no passo 1.3 para dentro de nossa aplicação.
DESCOMPACTE-O DENTRO DO WORKSPACEDO SEU PROJETO.
Crie um arquivo com nome local e com extensão ".properties" (local.properties) com o seguinte conteúdo: (substituindo "C:/Eclipse Android/sdk/" pelo caminho do seu SDK).
Salve o arquivo dento da pasta do Facebook SDK que baixamos.
Ainda dentro da pasta, abra o arquivo "settings.gradle" e adicione duas barras ( // ) no início das linhas que contém o seguinte conteúdo:
Salve o arquivo.
Agora, no project explorer da sua aplicação clique com o botão direito do mouse e selecione import. Expanda a pasta Gradle, selecione Gradle Project e clique em Next.
As dependências do Facebook SDK são gerenciadas pelo Gradle, se você está usando o Android Studio então não terá problemas, porém, se você está utilizando o Eclipse você precisa ter o plugin do Gradle instalado em seu Eclipse para que as dependências do Facebook SDK sejam resolvidas. Para instalar o plugin do Gradle, em seu eclipse clique em help -> Install New Software..., adicione o repositório http://dist.springsource.com/release/TOOLS/update/e4.2 e instale apenas a opção Core / Eclipse Integration for Gradle.
Aponte para a pasta descompactada do Facebook SDK, Clique em Build Model, selecione apenas o projeto facebook e clique em finish.
Se ao compilar o projeto, você se deparar com esse erro:
Clique com o botão direito do mouse na pasta "gen" e selecione "Build Path -> Use as Source Folder".
Se ao compilar novamente você se deparar com esse erro:
Comente a linha com o erro e compile o projeto.
Clique com o botão direito do mouse na pasta "src" e selecione "Build Path -> Use as Source Folder".
Clique com o botão direito do mouse no projeto facebook referente ao SDK e selecione "Android Tools -> Add Support Library". Aceite o termos e clique em "Install".
1.5.2) Clique com o botão direito do mouse no projeto facebook referente ao SDK e clique em Properties. Selecione Java Compiler no menu esquerdo e mude todos os "combos" para 1.7. Ainda nesta janela, selecione Android no menu da esquerda e marque a opção Android 4.4W ou superior. Caso não tenha essa opção (ou superior), atualize suas APIs no Android SDK Manager.
Se o seu projeto ainda contiver erros relacionados ao "bolts" baixe aqui o projeto "bolts" direto do GitHub, descompacte-o e importe-o como projeto Android para dentro do eclipse.
Repita o passo 1.5.2 acima no projeto "bolts" que acabamos de baixar. Depois disso, ainda que o projeto "bolts" esteja com erro, provavelmente o arquivo "bolts.jar" já deverá ter sido gerado dentro da pasta "Bolts/bin/" e é apenas dele que precisamos. Copie o "bolts.jar" para dentro da pasta libs do projeto referente ao Facebook SDK e compile novamente o projeto.
Estamos quase lá!
Clique com o botão direito do mouse no projeto referente ao Facebook SDK e clique em Properties. Na janela que se seque, selecione Android no menu da esquerda e marque a opção "Is Library". Feito isso, compile novamente o projeto referente ao Facebook SDK e o arquivo facebook.jar será gerado dentro da pasta "/bin/". Copie este ".jar" para a pasta "/libs/" da sua aplicação e estaremos prontos para utilizar o Facebook SDK em nosso projeto!
1.6) Adicione a seguinte declaração de Activity no seu arquivo AndroidManifest.xml:
Pessoal, pra essa primeira parte (a mais difícil) ficaremos por aqui. No próximo tutorial aprendemos de fato a fazer login com o Fcebook e como recuperar dados de perfil do usuário.
Clique aqui para acessar a parte 2 deste tutorial.
Até a próxima! :)
1.1) Faça login no site do Facebook para desenvolvedores com sua conta do Facebook.
1.2) Na aba "My Apps" clique em Register as a Developer como mostra a figura abaixo:
A seguinte janela irá abrir. Aceite os termos e clique em cadastre-se:
1.3) Na tela que irá abrir, selecione Android, digite o nome da sua aplicação e clique em Create New Facebook App ID.
Na próxima tela escolha a categoria da sua aplicação e prossiga.
Faça o download do Facebook SDK for Android e guarde-o, iremos utilizá-lo nas próximas sessões.
No fim da página você precisará informar o pacote e a Activity principal da sua aplicação. O package você irá recuperar do arquivo AndroidManifest.xml na sua aplicação. Para o campo da Activity usaremos o caminho completo da Activity que é executada ao abrir sua aplicação. Segue imagens.
Clique em Avançar.
1.4) No próximo passo iremos gerar o Android Key Hash. Não é uma tarefa difícil, apenas execute o seguinte comando:
MAC:
keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore | openssl sha1 -binary | openssl base64
WINDOWS:
keytool -exportcert -alias androiddebugkey -keystore %HOMEPATH%\.android\debug.keystore | openssl sha1 -binary | openssl base64
Se ao executar o comando você se deparar com o erro "'openssl' is not recognized as an internal or external command, operable program or batch file." faça o download do openssl aqui, instale-o e execute o comando novamente substituindo "openssl" pelo caminho de instalação do mesmo. Desta forma:
keytool -exportcert -alias androiddebugkey -keystore %HOMEPATH%\.android\debug.keystore | "C:\OpenSSL-Win64\bin\openssl.exe" sha1 -binary | "C:\OpenSSL-Win64\bin\openssl.exe" base64
Caso seja solicitado alguma senha apenas dê enter. Copie o código base64 que é mostrado para a area do cadastro Facebook Developers que pede o código Hash
Clique em Avançar.
1.5) Vamos importar o Facebook SDK que baixamos no passo 1.3 para dentro de nossa aplicação.
DESCOMPACTE-O DENTRO DO WORKSPACEDO SEU PROJETO.
Crie um arquivo com nome local e com extensão ".properties" (local.properties) com o seguinte conteúdo: (substituindo "C:/Eclipse Android/sdk/" pelo caminho do seu SDK).
sdk.dir = C:/Eclipse Android/sdk/
Salve o arquivo dento da pasta do Facebook SDK que baixamos.
Ainda dentro da pasta, abra o arquivo "settings.gradle" e adicione duas barras ( // ) no início das linhas que contém o seguinte conteúdo:
//include 'tests'
//project(':tests').projectDir = new File('facebook/tests')
//include 'junitTests'
//project(':junitTests').projectDir = new File('facebook/junitTests')
Salve o arquivo.
Agora, no project explorer da sua aplicação clique com o botão direito do mouse e selecione import. Expanda a pasta Gradle, selecione Gradle Project e clique em Next.
As dependências do Facebook SDK são gerenciadas pelo Gradle, se você está usando o Android Studio então não terá problemas, porém, se você está utilizando o Eclipse você precisa ter o plugin do Gradle instalado em seu Eclipse para que as dependências do Facebook SDK sejam resolvidas. Para instalar o plugin do Gradle, em seu eclipse clique em help -> Install New Software..., adicione o repositório http://dist.springsource.com/release/TOOLS/update/e4.2 e instale apenas a opção Core / Eclipse Integration for Gradle.
Aponte para a pasta descompactada do Facebook SDK, Clique em Build Model, selecione apenas o projeto facebook e clique em finish.
Se ao compilar o projeto, você se deparar com esse erro:
[2015-04-04 22:21:21 - facebook] /facebook/gen already exists but is not a source folder. Convert to a source folder or rename it.
Clique com o botão direito do mouse na pasta "gen" e selecione "Build Path -> Use as Source Folder".
Se ao compilar novamente você se deparar com esse erro:
[2015-04-04 22:25:27 - facebook] D:\facebook-android-sdk-4.0.1\facebook\res\values\messenger_button_styles.xml:66: error: Error: No resource found that matches the given name: attr 'android:textAllCaps'.
Comente a linha com o erro e compile o projeto.
Clique com o botão direito do mouse na pasta "src" e selecione "Build Path -> Use as Source Folder".
Clique com o botão direito do mouse no projeto facebook referente ao SDK e selecione "Android Tools -> Add Support Library". Aceite o termos e clique em "Install".
1.5.2) Clique com o botão direito do mouse no projeto facebook referente ao SDK e clique em Properties. Selecione Java Compiler no menu esquerdo e mude todos os "combos" para 1.7. Ainda nesta janela, selecione Android no menu da esquerda e marque a opção Android 4.4W ou superior. Caso não tenha essa opção (ou superior), atualize suas APIs no Android SDK Manager.
Se o seu projeto ainda contiver erros relacionados ao "bolts" baixe aqui o projeto "bolts" direto do GitHub, descompacte-o e importe-o como projeto Android para dentro do eclipse.
Repita o passo 1.5.2 acima no projeto "bolts" que acabamos de baixar. Depois disso, ainda que o projeto "bolts" esteja com erro, provavelmente o arquivo "bolts.jar" já deverá ter sido gerado dentro da pasta "Bolts/bin/" e é apenas dele que precisamos. Copie o "bolts.jar" para dentro da pasta libs do projeto referente ao Facebook SDK e compile novamente o projeto.
Estamos quase lá!
Clique com o botão direito do mouse no projeto referente ao Facebook SDK e clique em Properties. Na janela que se seque, selecione Android no menu da esquerda e marque a opção "Is Library". Feito isso, compile novamente o projeto referente ao Facebook SDK e o arquivo facebook.jar será gerado dentro da pasta "/bin/". Copie este ".jar" para a pasta "/libs/" da sua aplicação e estaremos prontos para utilizar o Facebook SDK em nosso projeto!
1.6) Adicione a seguinte declaração de Activity no seu arquivo AndroidManifest.xml:
...
<activity
android:name="com.facebook.FacebookActivity"
android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation"
android:theme="@android:style/Theme.Translucent.NoTitleBar"
android:label="@string/app_name">
</activity>
...
Pessoal, pra essa primeira parte (a mais difícil) ficaremos por aqui. No próximo tutorial aprendemos de fato a fazer login com o Fcebook e como recuperar dados de perfil do usuário.
Clique aqui para acessar a parte 2 deste tutorial.
Até a próxima! :)
Quando importo meu projeto gradle, nao aparece nenhum erro, mas tbm nao tem a aba android no properties do projeto facebook. O que pode ser?
ResponderExcluir