Autenticação OAuth com Flask - Conecte-se ao Google, Twitter e Facebook
Neste artigo, vamos construir um aplicativo de frasco que usará o protocolo OAuth para obter informações do usuário. Primeiro, precisamos entender o protocolo OAuth e seu procedimento.
O que é OAuth?
OAuth significa Open Authorization e foi implementado para conseguir uma conexão entre serviços online. O site da comunidade OAuth o define como “ Um protocolo aberto para permitir autorização segura em um método simples e padrão de aplicativos da web, móveis e desktop. ”. Um exemplo popular de OAuth seria o botão Sign in with Google presente em vários sites. Aqui, o serviço do site se conecta ao serviço google para fornecer a você uma opção fácil de autorizar seu recurso para o serviço desejado. Existem duas versões do OAuth OAuth1.0 e OAuth2.0 agora.
Terminologias em OAuth
- Cliente: é o aplicativo ou serviço tentando se conectar a outro serviço.
- Provedor: É o serviço ao qual o cliente se conecta.
- URL de autorização : é a URL fornecida pelo provedor para a qual o cliente envia requests.
- ID do cliente e segredo: são fornecidos pelo provedor e usados quando a solicitação de autorização é enviada ao provedor pelo cliente.
- Código de Autorização: É um código recuperado pelo cliente na autenticação bem-sucedida do usuário e enviado ao servidor de autorização do provedor.
- URL de retorno de chamada: é a URL definida pelo cliente para a qual o provedor envia o código de autorização e os recursos do usuário são recuperados pelo serviço de cliente.
Etapas envolvidas para configurar o OAuth
Etapa 1: registre seu aplicativo como um cliente no site do provedor. Você receberá as credenciais do cliente, que incluem o ID do cliente e o segredo do cliente.
Etapa 2: o aplicativo cliente envia uma solicitação de autorização ao URL de autorização do provedor.
Etapa 3: o usuário se autentica no site do provedor e permite que os recursos sejam usados pelo serviço de cliente.
Etapa 4: o provedor envia o código de autorização ao cliente
Etapa 5: o cliente envia o código de autorização ao servidor de autorização do provedor.
Etapa 6: O provedor envia os tokens de cliente que podem ser usados para acessar os recursos do usuário.
Agora que o conceito de OAuth está claro, podemos começar a construir nosso aplicativo. Existem várias bibliotecas disponíveis para nós que podem ser usadas para obter OAuth. A biblioteca que usaremos é AuthLib, que oferece suporte a OAuth 1.0 e OAuth 2.0.
Instalando dependências necessárias
Para instalar as dependências necessárias, digite o comando abaixo no terminal.
pip install -U Flask Authlib requests
Nota: É recomendável criar um ambiente virtual antes de instalar essas dependências.
Recupere as credenciais do cliente dos provedores
- Google: crie seu cliente OAuth do Google em https://console.cloud.google.com/apis/credentials, certifique-se de adicionar http: // localhost: 5000 / google / auth / aos URIs de redirecionamento autorizados.
- Twitter: crie seu cliente Oauth 1.0 do Twitter em https://developer.twitter.com/ criando um aplicativo. Adicione http: // localhost: 5000 / twitter / auth / aos URIs de redirecionamento autorizados.
- Facebook: crie seu cliente OAuth do Facebook em https://developer.facebook.com/, criando um aplicativo. Adicione http: // localhost: 5000 / facebook / auth / aos URIs de redirecionamento autorizados.
As credenciais do cliente podem ser usadas diretamente no programa, mas na produção real, essas credenciais devem ser armazenadas em variáveis de ambiente.
Crie a IU
Crie uma pasta chamada templates e, dentro dela, crie um arquivo index.html. Cole o seguinte código dentro do arquivo index.html. É um código simples que cria botões para cada provedor.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Authlib Connect</title>
</head>
<body>
<p align="center">
<a href="google/">
<img id="google"
src="https://img.shields.io/badge/Google-Connect-brightgreen?style=for-the-badge&labelColor=black&logo=google"
alt="Google"> <br>
</a>
<a href="twitter/">
<img id="twitter"
src="https://img.shields.io/badge/Twitter-Connect-brightgreen?style=for-the-badge&labelColor=black&logo=twitter"
alt="Twitter"> <br>
</a>
<a href="facebook/">
<img id="facebook"
src="https://img.shields.io/badge/Facebook-Connect-brightgreen?style=for-the-badge&labelColor=black&logo=facebook"
alt="Facebook"> <br>
</a>
</p>
</body>
</html>Criação do aplicativo Flask
Inicialize o aplicativo de frasco
Vamos criar um aplicativo de frasco simples que não fará nada e simplesmente renderizará o arquivo HTML criado acima na página inicial.
from flask import Flask, render_template
app = Flask(__name__)
app.secret_key = '\xfd{H\xe5<\x95\xf9\xe3\x96.5\xd1\x01O<\
!\xd5\xa2\xa0\x9fR"\xa1\xa8'
'''
Set SERVER_NAME to localhost as twitter callback
url does not accept 127.0.0.1
Tip : set callback origin(site) for facebook and twitter
as http://domain.com (or use your domain name) as this provider
don't accept 127.0.0.1 / localhost
'''
app.config['SERVER_NAME'] = 'localhost:5000'
@app.route('/')
def index():
return render_template('index.html')
if __name__ == "__main__":
app.run(debug=True)Execute o servidor usando o seguinte comando para verificar se o aplicativo está sendo executado com êxito e se a página index.html é exibida.
Depois de criar os aplicativos, vamos ver como adicionar o Oauth para google, Twitter e Facebook. Mas primeiro vamos inicializar o OAuth.
Inicializar OAuth
from flask import Flask, render_template
from authlib.integrations.flask_client import OAuth
app = Flask(__name__)
app.secret_key = '\xfd{H\xe5<\x95\xf9\xe3\x96.5\xd1\x01O<!/
\xd5\xa2\xa0\x9fR"\xa1\xa8'
'''
Set SERVER_NAME to localhost as twitter callback
url does not accept 127.0.0.1
Tip : set callback origin(site) for facebook and twitter
as http://domain.com (or use your domain name) as this provider
don't accept 127.0.0.1 / localhost
'''
app.config['SERVER_NAME'] = 'localhost:5000'
oauth = OAuth(app)
@app.route('/')
def index():
return render_template('index.html')
if __name__ == "__main__":
app.run(debug=True)Aqui, inicializamos o OAuth usando a classe OAuth (app) e alteramos o nome do nosso servidor para localhost: 5000. Agora vamos ver como criar o OAuth para diferentes plataformas.
Crie OAuth para o Google
# The user details get print in the console.
# so you can do whatever you want to do instead
# of printing it
from flask import Flask, render_template, url_for, redirect
from authlib.integrations.flask_client import OAuth
import os
app = Flask(__name__)
app.secret_key = '\xfd{H\xe5<\x95\xf9\xe3\x96.5\xd1\x01O<!/
xd5\xa2\xa0\x9fR"\xa1\xa8'
'''
Set SERVER_NAME to localhost as twitter callback
url does not accept 127.0.0.1
Tip : set callback origin(site) for facebook and twitter
as http://domain.com (or use your domain name) as this provider
don't accept 127.0.0.1 / localhost
'''
app.config['SERVER_NAME'] = 'localhost:5000'
oauth = OAuth(app)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/google/')
def google():
# Google Oauth Config
# Get client_id and client_secret from enviroment variables
# For developement purpose you can directly put it
# here inside double quotes
GOOGLE_CLIENT_ID = os.environ.get('GOOGLE_CLIENT_ID')
GOOGLE_CLIENT_SECRET = os.environ.get('GOOGLE_CLIENT_SECRET')
CONF_URL = 'https://accounts.google.com/.well-known/openid-configuration'
oauth.register(
name='google',
client_id=GOOGLE_CLIENT_ID,
client_secret=GOOGLE_CLIENT_SECRET,
server_metadata_url=CONF_URL,
client_kwargs={
'scope': 'openid email profile'
}
)
# Redirect to google_auth function
redirect_uri = url_for('google_auth', _external=True)
return oauth.google.authorize_redirect(redirect_uri)
@app.route('/google/auth/')
def google_auth():
token = oauth.google.authorize_access_token()
user = oauth.google.parse_id_token(token)
print(" Google User ", user)
return redirect('/')
if __name__ == "__main__":
app.run(debug=True)Criar OAuth para Twitter
# The user details get print in the console.
# so you can do whatever you want to do instead
# of printing it
from flask import Flask, render_template, url_for, redirect
from authlib.integrations.flask_client import OAuth
import os
app = Flask(__name__)
app.secret_key = '\xfd{H\xe5<\x95\xf9\xe3\x96.5\xd1\x01O/
<!\xd5\xa2\xa0\x9fR"\xa1\xa8'
'''
Set SERVER_NAME to localhost as twitter callback
url does not accept 127.0.0.1
Tip : set callback origin(site) for facebook and twitter
as http://domain.com (or use your domain name) as this provider
don't accept 127.0.0.1 / localhost
'''
app.config['SERVER_NAME'] = 'localhost:5000'
oauth = OAuth(app)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/google/')
def google():
# Google Oauth Config
# Get client_id and client_secret from enviroment variables
# For developement purpose you can directly put it here inside double quotes
GOOGLE_CLIENT_ID = os.environ.get('GOOGLE_CLIENT_ID')
GOOGLE_CLIENT_SECRET = os.environ.get('GOOGLE_CLIENT_SECRET')
CONF_URL = 'https://accounts.google.com/.well-known/openid-configuration'
oauth.register(
name='google',
client_id=GOOGLE_CLIENT_ID,
client_secret=GOOGLE_CLIENT_SECRET,
server_metadata_url=CONF_URL,
client_kwargs={
'scope': 'openid email profile'
}
)
# Redirect to google_auth function
redirect_uri = url_for('google_auth', _external=True)
return oauth.google.authorize_redirect(redirect_uri)
@app.route('/google/auth/')
def google_auth():
token = oauth.google.authorize_access_token()
user = oauth.google.parse_id_token(token)
print(" Google User ", user)
return redirect('/')
@app.route('/twitter/')
def twitter():
# Twitter Oauth Config
TWITTER_CLIENT_ID = os.environ.get('TWITTER_CLIENT_ID')
TWITTER_CLIENT_SECRET = os.environ.get('TWITTER_CLIENT_SECRET')
oauth.register(
name='twitter',
client_id=TWITTER_CLIENT_ID,
client_secret=TWITTER_CLIENT_SECRET,
request_token_url='https://api.twitter.com/oauth/request_token',
request_token_params=None,
access_token_url='https://api.twitter.com/oauth/access_token',
access_token_params=None,
authorize_url='https://api.twitter.com/oauth/authenticate',
authorize_params=None,
api_base_url='https://api.twitter.com/1.1/',
client_kwargs=None,
)
redirect_uri = url_for('twitter_auth', _external=True)
return oauth.twitter.authorize_redirect(redirect_uri)
@app.route('/twitter/auth/')
def twitter_auth():
token = oauth.twitter.authorize_access_token()
resp = oauth.twitter.get('account/verify_credentials.json')
profile = resp.json()
print(" Twitter User", profile)
return redirect('/')
if __name__ == "__main__":
app.run(debug=True)Criar OAuth para Facebook
# The user details get print in the console.
# so you can do whatever you want to do instead
# of printing it
from flask import Flask, render_template, url_for, redirect
from authlib.integrations.flask_client import OAuth
import os
app = Flask(__name__)
app.secret_key = '\xfd{H\xe5<\x95\xf9\xe3\x96.5\xd1\x01O/
<!\xd5\xa2\xa0\x9fR"\xa1\xa8'
'''
Set SERVER_NAME to localhost as twitter callback
url does not accept 127.0.0.1
Tip : set callback origin(site) for facebook and twitter
as http://domain.com (or use your domain name) as this provider
don't accept 127.0.0.1 / localhost
'''
app.config['SERVER_NAME'] = 'localhost:5000'
oauth = OAuth(app)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/google/')
def google():
# Google Oauth Config
# Get client_id and client_secret from enviroment variables
# For developement purpose you can directly put it here inside double quotes
GOOGLE_CLIENT_ID = os.environ.get('GOOGLE_CLIENT_ID')
GOOGLE_CLIENT_SECRET = os.environ.get('GOOGLE_CLIENT_SECRET')
CONF_URL = 'https://accounts.google.com/.well-known/openid-configuration'
oauth.register(
name='google',
client_id=GOOGLE_CLIENT_ID,
client_secret=GOOGLE_CLIENT_SECRET,
server_metadata_url=CONF_URL,
client_kwargs={
'scope': 'openid email profile'
}
)
# Redirect to google_auth function
redirect_uri = url_for('google_auth', _external=True)
return oauth.google.authorize_redirect(redirect_uri)
@app.route('/google/auth/')
def google_auth():
token = oauth.google.authorize_access_token()
user = oauth.google.parse_id_token(token)
print(" Google User ", user)
return redirect('/')
@app.route('/twitter/')
def twitter():
# Twitter Oauth Config
TWITTER_CLIENT_ID = os.environ.get('TWITTER_CLIENT_ID')
TWITTER_CLIENT_SECRET = os.environ.get('TWITTER_CLIENT_SECRET')
oauth.register(
name='twitter',
client_id=TWITTER_CLIENT_ID,
client_secret=TWITTER_CLIENT_SECRET,
request_token_url='https://api.twitter.com/oauth/request_token',
request_token_params=None,
access_token_url='https://api.twitter.com/oauth/access_token',
access_token_params=None,
authorize_url='https://api.twitter.com/oauth/authenticate',
authorize_params=None,
api_base_url='https://api.twitter.com/1.1/',
client_kwargs=None,
)
redirect_uri = url_for('twitter_auth', _external=True)
return oauth.twitter.authorize_redirect(redirect_uri)
@app.route('/twitter/auth/')
def twitter_auth():
token = oauth.twitter.authorize_access_token()
resp = oauth.twitter.get('account/verify_credentials.json')
profile = resp.json()
print(" Twitter User", profile)
return redirect('/')
@app.route('/facebook/')
def facebook():
# Facebook Oauth Config
FACEBOOK_CLIENT_ID = os.environ.get('FACEBOOK_CLIENT_ID')
FACEBOOK_CLIENT_SECRET = os.environ.get('FACEBOOK_CLIENT_SECRET')
oauth.register(
name='facebook',
client_id=FACEBOOK_CLIENT_ID,
client_secret=FACEBOOK_CLIENT_SECRET,
access_token_url='https://graph.facebook.com/oauth/access_token',
access_token_params=None,
authorize_url='https://www.facebook.com/dialog/oauth',
authorize_params=None,
api_base_url='https://graph.facebook.com/',
client_kwargs={'scope': 'email'},
)
redirect_uri = url_for('facebook_auth', _external=True)
return oauth.facebook.authorize_redirect(redirect_uri)
@app.route('/facebook/auth/')
def facebook_auth():
token = oauth.facebook.authorize_access_token()
resp = oauth.facebook.get(
'https://graph.facebook.com/me?fields=id,name,email,picture{url}')
profile = resp.json()
print("Facebook User ", profile)
return redirect('/')
if __name__ == "__main__":
app.run(debug=True)Execute o aplicativo
Inicie o servidor com:
python app.py
Então visite:
http://localhost:5000/
Observação: a configuração do OAuth para cada provedor é diferente e depende da versão do OAuth. Cada provedor tem sua própria documentação sobre a implementação do protocolo, portanto, certifique-se de verificá-la.
Atenção geek! Fortaleça suas bases com o Python Programming Foundation Course e aprenda o básico.
As postagens do blog Acervo Lima te ajudaram? Nos ajude a manter o blog no ar!
Faça uma doação para manter o blog funcionando.
70% das doações são no valor de R$ 5,00...
Diógenes Lima da Silva
