Última modificação em 27 de dezembro de 2020.

Quase todos os gigantes da Internet (no bom sentido) como Google, Facebook, Twitter e LinkedIn suportam login OAuth. Eles fornecem API com documentação detalhada para ajudar os desenvolvedores a integrar a autenticação OAuth.

Existem muitas bibliotecas cliente disponíveis para implementar o login OAuth do Twitter. Mas faremos apenas com o PHP básico. Sim, na verdade, é suficiente, leve e melhor.

O aplicativo com o recurso de login OAuth tem muitas vantagens.

  • Simplifica o processo de login.
  • Reduz o atrito, minimizando o esforço do usuário com um único clique.
  • Evita que os desenvolvedores construam um login personalizado.
  • Garante um fluxo de autenticação seguro.

Já vimos como integrar o login OAuth do Facebook em um aplicativo. Vamos ver como fazer login com o Twitter usando autenticação OAuth.

Em sua galeria de APIs da comunidade, o Twitter lista muitas bibliotecas PHP. Essas bibliotecas contêm manipuladores para leitura e gravação de dados da API de maneira segura. Uma etapa de autenticação garante a segurança de acesso em cada solicitação de API.

O Twitter usa vários métodos de autenticação. Esses são, OAuth 1.0a, token do portador OAuth 2.0, autenticação básica. Usei a autenticação OAuth 1.0a para validar o login com o Twitter Solicitações de API.

Durante o fluxo de login, o Twitter solicita a inserção das credenciais do usuário para fazer o login. Em seguida, ele pedirá para autorizar o aplicativo pela primeira vez.

O fluxo de “Login com Twitter” é muito semelhante ao fluxo OAuth de três etapas usado para obter o token de acesso. Com a referência desse token, a API retornará os dados do usuário de acordo com o URL da solicitação. Este exemplo irá ler o nome do usuário, foto e mais detalhes após a autenticação bem-sucedida.

Neste artigo, veremos como integrar o “Login ao Twitter” concluindo cada uma das etapas abaixo.

  • Como obter e configurar as chaves de API.
  • Como realizar o fluxo de autenticação de 3 etapas.
  • Crie solicitações e gerencie respostas durante o fluxo de autenticação.
  • Armazene os dados do usuário autenticado no banco de dados.

O que há dentro?

  1. Fluxo de login do Twitter OAuth
  2. Como integrar o login OAuth do Twitter?
  3. Gerando chaves de aplicativo do Twitter
  4. Sobre isso exemplo
  5. Serviço Twitter OAuth PHP
  6. código PHP para lidar com os dados do usuário conectado
  7. Script de banco de dados
  8. Login com saída de exemplo PHP do Twitter

Fluxo de login do Twitter OAuth

O fluxo de autenticação de login do Twitter inclui três etapas.

  1. Obtenha um token de solicitação e uma chave secreta.
  2. Redirecionar para o Twitter para fazer login e aprovar direitos de acesso ao aplicativo do Twitter.
  3. Obtenha um token de acesso e a chave secreta para acessar a conta do usuário via API.

Durante o processo de login OAuth, cada solicitação deve ser assinada com uma assinatura OAuth. Neste exemplo, ele tem uma classe de serviço para preparar solicitações assinadas.

O diagrama a seguir mostra o fluxo de “Login com Twitter”. Indica as etapas, parâmetros de solicitação e dados de resposta da API.

Diagrama de autenticação de login OAuth em três etapas do Twitter

Clique para ver uma imagem maior.

Como integrar o login OAuth do Twitter?

O Twitter fornece um controle de botão Login com Twitter ou Login com Twitter para colocar em um aplicativo. Isso faz com que os usuários façam login no aplicativo com alguns cliques.

Depois de obter as chaves da API do Twitter e o segredo do token, configure-os com o aplicativo PHP. A próxima seção mostrará o arquivo de configuração criado para este exemplo.

Em seguida, crie os manipuladores de solicitação-resposta para se comunicar com a API do Twitter. Ele continuará o processo passo a passo para obter tokens para processar a próxima solicitação.

Em vez de usar gerenciadores personalizados, podemos usar bibliotecas de cliente integradas do Twitter.

Com o access_token, a API permitirá o acesso para atingir os endpoints. Mas, isso depende das permissões do aplicativo definidas no console do desenvolvedor.

Ao obter os dados de resposta da API, o fluxo de login do aplicativo chega ao fim. Com esta etapa, ele mudará o status de login dos usuários do aplicativo na IU.

Gerando chaves de API do Twitter

O processo de geração de chaves de API do Twitter é direto. Depois de ver as etapas para obter as chaves para integração de login do Google OAuth .

Faça login no portal do desenvolvedor do Twitter e siga as etapas abaixo.

  1. Faça login no Twitter e vá para o console do desenvolvedor.
  2. Crie um aplicativo de desenvolvedor do Twitter. (aplicativo específico do projeto ou aplicativo independente).
  3. Vá para as configurações do aplicativo para editar permissões e configurações de autenticação.
  4. Vá para a guia “chaves e tokens” para copiar a chave do consumidor e a chave secreta.
  5. Salve as chaves em um local seguro e configure-as no aplicativo.

Chaves de API do Twitter

O Twitter permite a criação de dois tipos de aplicativos de desenvolvedor. Um aplicativo específico do projeto ou um aplicativo independente. O aplicativo específico do projeto pode usar endpoints v2. Os aplicativos autônomos podem acessar apenas os endpoints v1.

As chaves da API do Twitter não manterão mais as chaves e tokens da API permanentemente. Isso é para fins de segurança. Mas permite regenerar as chaves e tokens.

Configure o Twitter App consumer_key e secret_key no arquivo Config.php. Esta configuração de aplicativo define as constantes do aplicativo. Inclui o caminho raiz, a configuração do banco de dados e o consumidor do Twitter e a chave secreta.

Comum/config.php

 

Sobre este exemplo

Existem várias maneiras de implementar o login OAuth do Twitter em um aplicativo PHP. Geralmente, as pessoas usam bibliotecas integradas do lado do cliente para implementar isso. O Twitter também recomenda uma ou mais bibliotecas PHP em sua galeria de API da comunidade.

Este exemplo mostra um código simples para integração de “Login com Twitter”. Ele usa nenhuma biblioteca externa para fazer isso.

Ele tem uma classe personalizada que prepara a solicitação da API e trata as respostas. Ele cria assinaturas OAuth para enviar solicitações assinadas válidas para a API.

Uma página de destino mostrará o botão “Sign in with Twitter” para acionar o processo de login OAuth. Ao clicar, ele invoca o serviço PHP para prosseguir com o fluxo de login de três etapas.

Como resultado, ele obtém os dados do usuário do Twitter na autenticação bem-sucedida. A página resultante mudará o estado de login e exibirá os dados do usuário.

Se você se recusar a aprovar o acesso ou login do aplicativo, o Twitter irá redirecionar de volta para o aplicativo. Este URL de redirecionamento é definido com a lista de parâmetros da solicitação da API.

Este exemplo usa o banco de dados para manter os detalhes do usuário lidos na resposta da API. Assim, ele registra os usuários do aplicativo conectados por meio de login OAuth do Twitter.

Twitter OAuth File Structure

Serviço Twitter OAuth PHP

Esta classe de serviço PHP solicita a API do Twitter para a chave de acesso e token. Ele segue as três etapas para obter o token de acesso.

Vimos etapas semelhantes para obter o token de acesso no exemplo de login do LinkedIn OAuth código anterior.

Os três métodos a seguir executam as três etapas.

Etapa 1: getRequestToken () -envia o oauth_callback com o cabeçalho de autenticação. Ele solicita request_token e a chave secreta da API do Twitter.

Etapa 2: getOAuthVerifier () -redireciona o usuário para a página de autenticação do Twitter. Ele permite que os usuários façam login e aprove o aplicativo para acessar a conta. Ele passa o token de solicitação OAuth recebido na etapa 1 com o URL. Após a autenticação, o Twitter invocará o oauth_callback com o oauth_verifier na string de consulta.

Etapa 3: getAccessToken () -solicita o access_token e a chave secreta da API. Os parâmetros são request_token, request_token_secret, oauth_verifier obtido da Etapa 1, 2.

O Twitter requer que cada uma das solicitações de API seja assinada. Esta classe de serviço PHP tem uma função para gerar a assinatura pelo uso de parâmetros de solicitação de API.

lib/TwitterOAuthLogin.php

  consumerKey=Config:: TW_CONSUMER_KEY; $ this-> consumerSecret=Config:: TW_CONSUMER_SECRET; } public function getOauthVerifier () { $ requestResponse=$ this-> getRequestToken (); $ authUrl="https://api.twitter.com/oauth/authenticate"; $ redirectUrl=$ authUrl."? oauth_token=". $ requestResponse ["request_token"]; return $ redirectUrl; } public function getRequestToken () { $ url="https://api.twitter.com/oauth/request_token"; $ params=array ( 'oauth_callback'=> Config:: TW_CALLBACK_URL, "oauth_consumer_key"=> $ this-> consumerKey, "oauth_nonce"=> $ this-> getToken (42), "oauth_signature_method"=> $ this-> signatureMethod, "oauth_timestamp"=> time (), "oauth_version"=> $ this-> oauthVersion ); $ params ['oauth_signature']=$ this-> createSignature ('POST', $ url, $ params); $ oauthHeader=$ this-> generateOauthHeader ($ params); $ response=$ this-> curlHttp ('POST', $ url, $ oauthHeader); $ responseVariables=array (); parse_str ($ resposta, $ responseVariables); $ tokenResponse=array (); $ tokenResponse ["request_token"]=$ responseVariables ["oauth_token"]; $ tokenResponse ["request_token_secret"]=$ responseVariables ["oauth_token_secret"]; session_start (); $ _SESSION ["oauth_token"]=$ tokenResponse ["request_token"]; $ _SESSION ["oauth_token_secret"]=$ tokenResponse ["request_token_secret"]; session_write_close (); return $ tokenResponse; } public function getAccessToken ($ oauthVerifier, $ oauthToken, $ oauthTokenSecret) { $ url='https://api.twitter.com/oauth/access_token'; $ oauthPostData=array ( 'oauth_verifier'=> $ oauthVerifier ); $ params=array ( "oauth_consumer_key"=> $ this-> consumerKey, "oauth_nonce"=> $ this-> getToken (42), "oauth_signature_method"=> $ this-> signatureMethod, "oauth_timestamp"=> time (), "oauth_token"=> $ oauthToken, "oauth_version"=> $ this-> oauthVersion ); $ params ['oauth_signature']=$ this-> createSignature ('POST', $ url, $ params, $ oauthTokenSecret); $ oauthHeader=$ this-> generateOauthHeader ($ params); $ response=$ this-> curlHttp ('POST', $ url, $ oauthHeader, $ oauthPostData); $ fp=fopen ("eg.log","a"); fwrite ($ fp,"AccessToken:". $ response."\ n"); $ responseVariables=array (); parse_str ($ resposta, $ responseVariables); $ tokenResponse=array (); $ tokenResponse ["access_token"]=$ responseVariables ["oauth_token"]; $ tokenResponse ["access_token_secret"]=$ responseVariables ["oauth_token_secret"]; return $ tokenResponse; } public function getUserData ($ oauthVerifier, $ oauthToken, $ oauthTokenSecret) { $ accessTokenResponse=$ this-> getAccessToken ($ oauthVerifier, $ oauthToken, $ oauthTokenSecret); $ url='https://api.twitter.com/1.1/account/verify_credentials.json'; $ params=array ( "oauth_consumer_key"=> $ this-> consumerKey, "oauth_nonce"=> $ this-> getToken (42), "oauth_signature_method"=> $ this-> signatureMethod, "oauth_timestamp"=> time (), "oauth_token"=> $ accessTokenResponse ["access_token"], "oauth_version"=> $ this-> oauthVersion ); $ params ['oauth_signature']=$ this-> createSignature ('GET', $ url, $ params, $ accessTokenResponse ["access_token_secret"]); $ oauthHeader=$ this-> generateOauthHeader ($ params); $ response=$ this-> curlHttp ('GET', $ url, $ oauthHeader); return $ response; } função pública curlHttp ($ httpRequestMethod, $ url, $ oauthHeader, $ post_data=null) { $ ch=curl_init (); $ fp=fopen ("eg.log","a"); fwrite ($ fp,"Cabeçalho:". $ oauthHeader."\ n"); $ headers=array ( "Autorização: OAuth". $ oauthHeader ); $ options=[ CURLOPT_HTTPHEADER=> $ cabeçalhos, CURLOPT_HEADER=> falso, CURLOPT_URL=> $ url, CURLOPT_RETURNTRANSFER=> verdadeiro, CURLOPT_SSL_VERIFYPEER=> falso, ]; if ($ httpRequestMethod=='POST') { $ options [CURLOPT_POST]=true; } if (! empty ($ post_data)) { $ options [CURLOPT_POSTFIELDS]=$ post_data; } curl_setopt_array ($ ch, $ options); $ resposta=curl_exec ($ ch); $ this-> http_status=curl_getinfo ($ ch, CURLINFO_HTTP_CODE); curl_close ($ ch); return $ response; } public function generateOauthHeader ($ params) { foreach ($ params as $ k=> $ v) { $ oauthParamArray []=$ k.'="'. rawurlencode ($ v).'"'; } $ oauthHeader=implode (',', $ oauthParamArray); return $ oauthHeader; } public function createSignature ($ httpRequestMethod, $ url, $ params, $ tokenSecret='') { $ strParams=rawurlencode (http_build_query ($ params)); $ baseString=$ httpRequestMethod."&". rawurlencode ($ url)."&". $ strParams; $ fp=fopen ("eg.log","a"); fwrite ($ fp,"Baaaase:". $ baseString."\ n"); $ signKey=$ this-> generateSignatureKey ($ tokenSecret); $ oauthSignature=base64_encode (hash_hmac ('sha1', $ baseString, $ signKey, true)); return $ oauthSignature; } public function generateSignatureKey ($ tokenSecret) { $ signKey=rawurlencode ($ this-> consumerSecret)."&"; if (! empty ($ tokenSecret)) { $ signKey=$ signKey. rawurlencode ($ tokenSecret); } return $ signKey; } public function getToken ($ length) { $ token=""; $ codeAlphabet="ABCDEFGHIJKLMNOPQRSTUVWXYZ"; $ codeAlphabet.="abcdefghijklmnopqrstuvwxyz"; $ codeAlphabet.="0123456789"; $ max=strlen ($ codeAlphabet)-1; para ($ i=0; $ i <$ comprimento; $ i ++) { $ token.=$ codeAlphabet [$ this-> cryptoRandSecure (0, $ max)]; } return $ token; } função pública cryptoRandSecure ($ min, $ max) { $ intervalo=$ max-$ min; if ($ range <1) { return $ min;//não tão aleatório... } $ log=ceil (log ($ range, 2)); $ bytes=(int) ($ log/8) + 1;//comprimento em bytes $ bits=(int) $ log + 1;//comprimento em bits $ filter=(int) (1 <<$ bits)-1;//defina todos os bits inferiores para 1 Faz { $ rnd=hexdec (bin2hex (openssl_random_pseudo_bytes ($ bytes))); $ rnd=$ rnd & $ filter;//descartar bits irrelevantes } while ($ rnd>=$ range); return $ min + $ rnd; }
}

Inicie o fluxo de login com o controle “Sign in with Twitter”

A página inicial deste exemplo mostrará um botão “Sign in with Twitter”. Ao clicar neste botão, ele invoca funções para prosseguir com o fluxo de login em 3 etapas.

O código a seguir mostra o script do arquivo index.php . Ele verifica se algum usuário já está logado. Em caso afirmativo, ele exibe o painel do usuário. Caso contrário, mostra o botão “Sign in with Twitter”.

Ele invoca o TwitterOAuthService para iniciar o fluxo de login. Esta iniciação acontecerá quando o usuário tentar fazer o login.

index.php

  getOauthVerifier (); header ("Location:". $ redirectUrl); Saída();
} session_start ();
if ($ _SESSION ["id"]) { $ memberId=$ _SESSION ["id"];
}
session_write_close (); ?>


 Home 


 
getUserById ($ memberId); ?>
" classe="foto-perfil"/>
Bem-vindo

Código PHP para lidar com os dados do usuário conectado

Depois de concluir as 3 etapas, o TwitterOauthService retornará o token de acesso do usuário. Em seguida, ele invoca o endpoint GET oauth/verify_credentials para ler o dia do usuário.

Ele retornará os dados do usuário conectado como uma resposta JSON. O endpoint de retorno de chamada do aplicativo recebe esses dados.

Então, o código salvará os dados no banco de dados e colocará o ID do usuário logado na sessão. Com base na existência desta sessão do usuário, a página de destino mostrará o painel do usuário.

sign-in-with-twitter.php

  getUserData ($ _ GET ["oauth_verifier"], $ _GET ["oauth_token"], $ oauthTokenSecret); $ userData=json_decode ($ userData, true); if (! empty ($ userData)) { $ oauthId=$ userData ["id"]; $ fullName=$ userData ["nome"]; $ screenName=$ userData ["screen_name"]; $ photoUrl=$ userData ["profile_image_url"]; require_once'./lib/Member.php'; $ membro=novo membro (); $ isMemberExists=$ member-> isExists ($ oauthId); if (vazio ($ isMemberExists)) { $ memberId=$ member-> insertMember ($ oauthId, $ fullName, $ screenName, $ photoUrl); } outro { $ memberId=$ isMemberExists [0] ["id"]; } if (! empty ($ memberId)) { não definido ($ _ SESSION ["oauth_token"]); não definido ($ _ SESSION ["oauth_token_secret"]); $ _SESSION ["id"]=$ memberId; cabeçalho ("Localização: index.php"); } }
} outro { ?>


 Login com Twitter 


 
Desculpa. Algo deu errado. Tente novamente .

A seguinte classe PHP tem funções para preparar consultas ao banco de dados. É ler dados, verificar a existência do usuário, inserir novos registros.

lib/Member.php

  db=new DataSource (); } função isExists ($ twitterOauthId) { $ query="SELECT * FROM tbl_member WHERE oauth_id=?"; $ paramType="s"; $ paramArray=array ( $ twitterOauthId ); $ result=$ this-> db-> select ($ query, $ paramType, $ paramArray); return $ result; } function insertMember ($ oauthId, $ fullName, $ screenName, $ photoUrl) { $ query="INSERT INTO tbl_member (oauth_id, oauth_provider, full_name, screen_name, photo_url) valores (?,?,?,?,?)"; $ paramType="sssss"; $ paramArray=array ( $ oauthId, 'Twitter', $ fullName, $ screenName, $ photoUrl ); $ this-> db-> insert ($ query, $ paramType, $ paramArray); } função getUserById ($ id) { $ query="SELECT * FROM tbl_member WHERE id=?"; $ paramType="i"; $ paramArray=array ( $ id ); $ result=$ this-> db-> select ($ query, $ paramType, $ paramArray); return $ result; }
}

Classe DataSource e script de banco de dados

As funções relacionadas ao banco de dados estão na classe DataSource. É para criar a conexão do banco de dados e realizar operações de leitura e gravação.

Ele usa instruções preparadas pelo MySQLi para executar consultas de banco de dados. Isso ajudará a ter um código seguro que evite injeção de SQL.

lib/DataSource.php

  conn=$ this-> getConnection (); } /** * Se o objeto de conexão for necessário, use este método e obtenha acesso a ele. * Caso contrário, use os métodos abaixo para inserir/atualizar/etc. * * @return \ mysqli */ public function getConnection () { $ conn=new \ mysqli (self:: HOST, self:: USERNAME, self:: PASSWORD, self:: DATABASENAME); if (mysqli_connect_errno ()) { trigger_error ("Problema ao conectar ao banco de dados."); } $ conn-> set_charset ("utf8"); return $ conn; } /** * Para obter resultados de banco de dados * * @param string $ query * @param string $ paramType * @param array $ paramArray * @return array */ seleção de função pública ($ query, $ paramType="", $ paramArray=array ()) { $ stmt=$ this-> conn-> prepare ($ query); if (! empty ($ paramType) &&! empty ($ paramArray)) { $ this-> bindQueryParams ($ stmt, $ paramType, $ paramArray); } $ stmt-> execute (); $ resultado=$ stmt-> get_result (); if ($ result-> num_rows> 0) { while ($ row=$ result-> fetch_assoc ()) { $ conjunto de resultados []=$ linha; } } if (! vazio ($ conjunto de resultados)) { return $ resultset; } } /** * Inserir * * @param string $ query * @param string $ paramType * @param array $ paramArray * @return int */ inserção de função pública ($ query, $ paramType, $ paramArray) { $ stmt=$ this-> conn-> prepare ($ query); $ this-> bindQueryParams ($ stmt, $ paramType, $ paramArray); $ stmt-> execute (); $ insertId=$ stmt-> insert_id; return $ insertId; } /** * Para executar a consulta * * @param string $ query * @param string $ paramType * @param array $ paramArray */ public function execute ($ query, $ paramType="", $ paramArray=array ()) { $ stmt=$ this-> conn-> prepare ($ query); if (! empty ($ paramType) &&! empty ($ paramArray)) { $ this-> bindQueryParams ($ stmt, $ paramType, $ paramArray); } $ stmt-> execute (); } /** * 1. * Prepara ligação de parâmetro * 2. Vincular prameters à instrução sql * * @param string $ stmt * @param string $ paramType * @param array $ paramArray */ public function bindQueryParams ($ stmt, $ paramType, $ paramArray=array ()) { $ paramValueReference []=& $ paramType; para ($ i=0; $ i  conn-> prepare ($ query); if (! empty ($ paramType) &&! empty ($ paramArray)) { $ this-> bindQueryParams ($ stmt, $ paramType, $ paramArray); } $ stmt-> execute (); $ stmt-> store_result (); $ recordCount=$ stmt-> num_rows; return $ recordCount; }
} 

A seção abaixo mostra o script da tabela do banco de dados tbl_member. Importe este script antes de executar este exemplo.

sql/structure.sql

-
-Banco de dados: `oauth_login`
- --------------------------------------------------------- -
-Estrutura da tabela para a tabela `tbl_member`
- CRIAR TABELA `tbl_member` ( `id` int (11) NÃO NULO, `oauth_id` varchar (255) NÃO NULO, `oauth_provider` varchar (255) NÃO NULO, `full_name` varchar (255) NÃO NULO, `screen_name` varchar (255) NÃO NULO, `photo_url` varchar (255) NÃO NULO, carimbo de data e hora `create_at` NOT NULL DEFAULT CURRENT_TIMESTAMP NA ATUALIZAÇÃO CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=latin1; -
-Índices para tabelas despejadas
- -
-Índices para a tabela `tbl_member`
-
ALTER TABLE `tbl_member` ADICIONE CHAVE PRIMÁRIA (`id`); -
-AUTO_INCREMENT para tabelas despejadas
- -
-AUTO_INCREMENT para a tabela `tbl_member`
-
ALTER TABLE `tbl_member` MODIFY `id` int (11) NOT NULL AUTO_INCREMENT;

Login com saída de exemplo do Twitter

Depois de concluir a configuração do aplicativo, a página inicial exibirá o botão “Sign in with Twitter” conforme abaixo.

Entrar com Twitter Gray

Antes do login, a página inicial exibirá o botão “Sign in with Twitter” como abaixo. Usei o botão de login baixado da documentação oficial do Twitter.

Painel do usuário Login do Twitter

Download

↑ Voltar ao topo

Source link

Categories: Wordpress