Cree una aplicación Flask para validar CAPTCHA

En este artículo, vamos a construir una aplicación web que puede tener un CAPTCHA. CAPTCHA es una herramienta que puede utilizar para diferenciar entre usuarios reales y usuarios automatizados. Los CAPTCHA generalmente se encuentran en las páginas de inicio de sesión o en las páginas de pago.

¿Qué es CAPTCHA?

Captcha es una estrategia utilizada para proteger los sitios contra el spam. El objetivo es evitar que los sitios intuitivos reciban correo no deseado examinando entradas creadas de forma natural. La abreviatura CAPTCHA significa ‘Prueba de Turing pública totalmente automatizada para distinguir computadoras y humanos’. Los captchas generalmente se utilizan cuando las aplicaciones web requieren la entrada del cliente. Imagine que está ejecutando una tienda en línea y necesita ofrecer a sus clientes la oportunidad de redactar encuestas de artículos en el segmento de comentarios. Para esta situación, debe asegurarse de que los pasajes sean realmente de sus clientes o, al menos, de los visitantes del sitio humano. Regularmente revisará los comentarios de spam producidos naturalmente, en el escenario más pesimista, conectándose con su oposición.

Nota: Para obtener más información, consulte ¿Qué es el código CAPTCHA?

Requisitos

  • Flask framework: Flask es una API de Python que nos permite construir aplicaciones web. El marco de Flask es más explícito que el marco de Django y también es más fácil de aprender porque tiene menos código base para implementar una aplicación web simple.
  • Biblioteca Flask-session-captcha: una implementación de captcha para Flask usando los paquetes Flask-sessionstore y Captcha. Cada respuesta de desafío de captcha se guarda en la sesión del lado del servidor del cliente desafiado.
  • MongoDB: MongoDB, la base de datos NoSQL más popular, es una base de datos orientada a documentos de código abierto. El término ‘NoSQL’ significa ‘no relacional’. Significa que MongoDB no se basa en la estructura de base de datos relacional similar a una tabla, sino que proporciona un mecanismo completamente diferente para el almacenamiento y la recuperación de datos.

Nota: La base de datos depende de su aplicación. La biblioteca Flask-session-captcha admite múltiples bases de datos, por lo que si está utilizando cualquier otra base de datos, asegúrese de consultar su documentación.

Cree la aplicación

Puede instalar todas las dependencias requeridas usando el siguiente comando

pip install -U Flask matraz-sesión-captcha Flask-Sessionstore pymongo

Se recomienda instalar todas las dependencias en el entorno virtual.

Implementación paso a paso

Paso 1: Crear la interfaz de usuario

Cree una carpeta llamada templates y dentro de ella cree un archivo HTML. Puede guardar el archivo HTML como form.html.

HTML

<form method="post">
    
    <!-- The following line creates the captcha -->
    {{ captcha() }}
    <input type="text" name="captcha">
    <input type="submit" name="submit">
</form>

Paso 2: Crear app.py

Creemos una aplicación simple que muestre el formulario anterior sin captcha.

Ejemplo: Inicializar aplicación Flask

Python3

from flask import Flask,render_template
  
app = Flask(__name__)
  
@app.route('/')
def index():
    return render_template('form.html')
    
if __name__ == "__main__":
    app.run(debug=True)

Ejecute el servidor con el siguiente comando para asegurarse de que la aplicación se ejecuta correctamente y se muestra la página form.html.

python app.py

Producción:

Paso 3: Inicializar PyMongoClient

Para usar Python en MongoDB, vamos a importar PyMongo. A partir de ahí, se puede importar MongoClient, que se utiliza para crear un cliente en la base de datos.

Python3

from flask import Flask, render_template
from pymongo import MongoClient
  
app = Flask(__name__)
  
# Database Config
# If your mongodb runs on a different port
# change 27017 to that port number
mongoClient = MongoClient('localhost', 27017)
  
@app.route('/')
def index():
    return render_template('form.html')
  
if __name__ == "__main__":
    app.run(debug=True)

Paso 4: Configurar Captcha

Se requieren varias configuraciones para usar el captcha en la aplicación. Aquí usaremos el módulo Flash_session_captcha que implementa captcha usando los paquetes Flash-sessionstore y Captcha. 

Python3

import uuid
from flask import Flask, render_template
from flask_sessionstore import Session
from flask_session_captcha import FlaskSessionCaptcha
from pymongo import MongoClient
  
app = Flask(__name__)
  
# Database Config
# If your mongodb runs on a different port
# change 27017 to that port number
mongoClient = MongoClient('localhost', 27017)
  
# Captcha Configuration
app.config["SECRET_KEY"] = uuid.uuid4()
app.config['CAPTCHA_ENABLE'] = True
  
# Set 5 as character length in captcha
app.config['CAPTCHA_LENGTH'] = 5
  
# Set the captcha height and width
app.config['CAPTCHA_WIDTH'] = 160
app.config['CAPTCHA_HEIGHT'] = 60
app.config['SESSION_MONGODB'] = mongoClient
app.config['SESSION_TYPE'] = 'mongodb'
  
# Enables server session
Session(app)
  
# Initialize FlaskSessionCaptcha
captcha = FlaskSessionCaptcha(app)
  
@app.route('/')
def index():
    return render_template('form.html')
  
if __name__ == "__main__":
    app.run(debug=True)

Paso 5: configurar el registro

El registro es un medio para rastrear eventos que ocurren cuando se ejecuta algún software. Aquí hemos utilizado el método logging.getLogger() que devuelve un registrador con un nombre específico; de lo contrario, devuelve el registrador raíz,

Python3

import uuid
import logging
from flask import Flask, render_template
from flask_sessionstore import Session
from flask_session_captcha import FlaskSessionCaptcha
from pymongo import MongoClient
  
app = Flask(__name__)
  
# Database Config
# If your mongodb runs on a different port
# change 27017 to that port number
mongoClient = MongoClient('localhost', 27017)
  
# Captcha Configuration
app.config["SECRET_KEY"] = uuid.uuid4()
app.config['CAPTCHA_ENABLE'] = True
  
# Set 5 as character length in captcha
app.config['CAPTCHA_LENGTH'] = 5
  
# Set the captcha height and width
app.config['CAPTCHA_WIDTH'] = 160
app.config['CAPTCHA_HEIGHT'] = 60
app.config['SESSION_MONGODB'] = mongoClient
app.config['SESSION_TYPE'] = 'mongodb'
  
# Enables server session
Session(app)
  
# Initialize FlaskSessionCaptcha
captcha = FlaskSessionCaptcha(app)
  
@app.route('/')
def index():
    return render_template('form.html')
  
  
if __name__ == "__main__":
    app.debug = True
    logging.getLogger().setLevel("DEBUG")
    app.run()

Paso 6: codificar la ruta de índice

Aquí hemos utilizado el método POST que devuelve la verificación de la entrada contra el captcha. Si el captcha coincide con el método exitoso, de lo contrario, se muestra el método fallido.

Python3

import uuid
import logging
from flask import Flask, request, render_template
from flask_sessionstore import Session
from flask_session_captcha import FlaskSessionCaptcha
from pymongo import MongoClient
  
app = Flask(__name__)
  
# Database Config
# If your mongodb runs on a different port
# change 27017 to that port number
mongoClient = MongoClient('localhost', 27017)
  
# Captcha Configuration
app.config["SECRET_KEY"] = uuid.uuid4()
app.config['CAPTCHA_ENABLE'] = True
  
# Set 5 as character length in captcha
app.config['CAPTCHA_LENGTH'] = 5
  
# Set the captcha height and width
app.config['CAPTCHA_WIDTH'] = 160
app.config['CAPTCHA_HEIGHT'] = 60
app.config['SESSION_MONGODB'] = mongoClient
app.config['SESSION_TYPE'] = 'mongodb'
  
# Enables server session
Session(app)
  
# Initialize FlaskSessionCaptcha
captcha = FlaskSessionCaptcha(app)
  
@app.route('/', methods=['POST', 'GET'])
def index():
    if request.method == "POST":
        if captcha.validate():
            return "success"
        else:
            return "fail"
  
    return render_template("form.html")
  
  
if __name__ == "__main__":
    app.debug = True
    logging.getLogger().setLevel("DEBUG")
    app.run()

Ejecute la aplicación

Iniciar servidor con:

python app.py

Entonces visite:

http://localhost:5000/

Producción:

Publicación traducida automáticamente

Artículo escrito por gupta_shrinath y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *