Sie möchten also eine App erstellen und viele Benutzer gewinnen?

Das tun wir alle und wenn Sie ein Anfänger sind, müssen Sie die folgenden E-Mail-Anmeldefunktionen berücksichtigen.

1. Gültige E-Mail-Adresse mit einem sicheren Passwort
2. Bot-Prävention
3. Double-Opt-In-Anmeldung

Ein solides E-Mail-Anmeldesystem ist für Web-Apps, Newsletter, Freebie-Downloads, Einladungen zu privaten Gruppen und Lead-Generierung unerlässlich. Verlassen Sie sich nicht darauf, Dienste von Drittanbietern wie Auth0, Facebook oder Google zu nutzen, um Zugriff auf Ihre App zu erhalten. Behalten Sie Ihre App-Daten!

Damit Sie beginnen können, sollten Sie etwas Erfahrung in Python haben, da wir das Flask-Framework mit einer MySQL-Datenbank verwenden werden. Das wird mehr Spaß machen als die Verwendung von Wordpress, dem beliebtesten CMS. Sie müssten für ein Wordpress-Plugin bezahlen, um die gleichen Funktionen wie eine kostenlose Flask-Erweiterung zu haben. Ich habe zuvor auf beiden aufgebaut und bevorzuge Python Flask für Web-Apps, obwohl Wordpress sehr gut in der Lage ist, Web-Apps zu erstellen.

Jeder Codeausschnitt wird erklärt und einige Kommentare in den Code eingefügt. Falls Sie die Benutzerregistrierung noch nicht erstellt haben oder nicht mit dem Innenleben vertraut sind, werde ich die Details für Sie beschreiben. Hier ist eine Zusammenfassung der Funktionen, die wir wie im ersten Absatz beschrieben implementieren werden:

1. Eine gültige E-Mail-Adresse kann überprüft werden, indem die Eingabezeichenfolge des Benutzers mithilfe eines regulären Ausdrucks oder einer Flask-Erweiterung analysiert wird. Wir erlauben keine zufälligen Text- oder SQL-Injection-Hacks.

2. Bot-Prävention kann mit einem versteckten Feld erfolgen, das dem Benutzer nicht angezeigt wird, aber normalerweise automatisch von Bots ausgefüllt wird, die nach anfälligen Anmeldeformularen suchen.

3. Die Double-Opt-In-Methode erfordert, dass der Empfänger Ihnen die Erlaubnis erteilt, ihm eine E-Mail zu senden, indem er einen Bestätigungslink in seinen Posteingang erhält. Dies dient hauptsächlich dazu, zu verhindern, dass jemand anderes Ihre E-Mail-Adresse verwendet. Dies verhindert auch, dass Testbenutzer sich einfach anmelden und ihr Konto aufgeben.

Lass es uns codieren!

Erstellen Sie ein Arbeitsverzeichnis:

mkdir signup
cd signup

Erstellen Sie Ihre Python-Umgebung mit python3 -m venv signup oder conda create -n signup python3. Ich bevorzuge Conda.

Erstellen Sie eine MySQL-Tabelle zum Speichern Ihrer Benutzer. Das validierte Feld ist für das Double-Opt-In:

CREATE TABLE users (
    id INT AUTO_INCREMENT PRIMARY KEY,
    email VARCHAR(120) NOT NULL UNIQUE,
    password VARCHAR(120) NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    validated BOOLEAN DEFAULT FALSE
);

Abhängigkeiten installieren:
pip flask flask-mail secure SQLAlchemy Flask-WTF Flask-SQLAlchemy mysql-connector-python

Alternativ können Sie dasselbe in einer Datei „requirements.txt“ auflisten lassen und pip install -r „requirements.txt

App.py-Datei mit den folgenden Abhängigkeiten erstellen:

from flask import Flask, render_template, request, url_for, redirect, flash
from flask_mail import Mail, Message
from datetime import datetime
from flask_sqlalchemy import SQLAlchemy
from sqlalchemy.sql import func
from itsdangerous import URLSafeTimedSerializer, SignatureExpired
from werkzeug.security import generate_password_hash, check_password_hash
import secrets

Geben Sie Ihre eigenen Serverkonfigurationsdaten mit diesen Zeilen ein:

# Flask configurations
secret = secrets.token_urlsafe(32)
app.secret_key = secret
app.config['SECRET_KEY'] = secret # auto-generated secret key

# SQLAlchemy configurations
SQLALCHEMY_DATABASE_URI = 'mysql mysqlconnector://admin:user@localhost/tablename'

# Email configurations
app.config['MAIL_SERVER'] = 'smtp.example.com'
app.config['MAIL_PORT'] = 587
app.config['MAIL_USERNAME'] = '[email protected]'
app.config['MAIL_PASSWORD'] = 'your_password'
app.config['MAIL_USE_TLS'] = True
app.config['MAIL_USE_SSL'] = False

db = SQLAlchemy(app)
mail = Mail(app)
s = URLSafeTimedSerializer(app.config['SECRET_KEY']) #set secret to the serliazer

Letztendlich sollten Sie Ihre Konfigurationsinformationen in einer .env-Datei haben.

Im nächsten Abschnitt wird die ORM-Struktur von SQLAlchemy verwendet, um die Datenbank für Sie abzufragen. Beachten Sie, dass der Klassenname mit dem Namen Ihrer Datenbanktabelle übereinstimmen sollte andernfalls erhalten Sie eine Fehlermeldung. Das db.model stellt Ihre Tabelleneinstellungen dar, einschließlich Spaltenname, Typ, Länge, Schlüssel und Nullwert:

class User(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    email = db.Column(db.String(120), unique=True, nullable=False)
    password = db.Column(db.String(120), nullable=False)
    created_at = db.Column(db.DateTime, server_default=db.func.now())
    validated = db.Column(db.Boolean, default=False)

Wenn Sie die MySQL-Datenbanktabelle noch nicht manuell erstellt haben, können Sie dies mit diesem Flask-Code direkt nach dem Klassenbenutzercodeblock tun:

# Create the database table
with app.app_context():
    db.create_all()

Um dieses Tutorial kürzer zu halten, überspringen wir die Indexseite oder die, wie Sie Ihre App-Homepage nennen würden, und zeigen einfach die Anmeldeseite an, indem wir Pythons Decorator-Funktion für die Seitenroute verwenden:

@app.route('/')
def index():
    return '
Homepage
'

@app.route('/signup', methods=['GET', 'POST'])
def signup():
    if request.method == 'POST':
        # Hidden field validation to prevent bot submission
        hidden_field = request.form.get('hidden_field')
        if hidden_field:
            return redirect(url_for('index'))  # Bot detected, ignore submission

        email = request.form['email']
        password = request.form['password']
        hashed_password = generate_password_hash(password, method='sha256')

        # Insert user into the database
        new_user = User(email=email, password=hashed_password)
        db.session.add(new_user)
        db.session.commit()

        # Send confirmation email
        token = s.dumps(email, salt='email-confirm')
        msg = Message('Confirm your Email', sender='[email protected]', recipients=[email])
        link = url_for('confirm_email', token=token, _external=True)
        msg.body = f'Your link is {link}'
        mail.send(msg)
        flash('A confirmation email has been sent to your email address.', 'success')
        return redirect(url_for('index'))
    return render_template('signup.html')

Bevor wir das HTML-Anmeldeformular hinzufügen, vervollständigen wir das Backend, indem wir die Route zur Validierung der Double-Opt-In-Funktion hinzufügen. Diese Route verwendet die zuvor erstellte Variable s, die das zeitkritische, geheime Token generiert. Einzelheiten finden Sie in den Dokumenten
Das maximale Alter beträgt die Sekunden vor Ablauf des Links. In diesem Fall hat der Benutzer also 20 Minuten Zeit, seine E-Mail-Adresse zu bestätigen.

@app.route('/confirm_email/')
def confirm_email(token):
    try:
        email = s.loads(token, salt='email-confirm', max_age=1200)  # Token expires after 1 hour
    except SignatureExpired:
        return '
The token is expired!
'

    # Update field in database
    user = User.query.filter_by(email=email).first_or_404()
    user.validated = True
    db.session.commit()

    return '
Email address confirmed!
'

Nun zur allgegenwärtigen Hauptanweisung, die Python anweist, das Skript auszuführen, wenn die Datei direkt ausgeführt wird (im Gegensatz zu einem importierten Modul):

if __name__ == '__main__':
    app.run(debug=True)

Bevor wir diesen Back-End-Code vervollständigen, benötigen wir noch den Front-End-HTML für die Benutzereingabe. Wir werden dies mit der integrierten Jinja-Vorlage von Flask tun. Erstellen Sie eine Datei mit dem Namen templates/signup.html, deren Name mit der Route übereinstimmen sollte, die Sie zuvor in app.py erstellt haben. Standardmäßig verwendet Jinja das Verzeichnis /templates für die HTML-Dateien. Sie können diese Einstellung ändern, aber für dieses Tutorial verwenden wir das Verzeichnis /templates der App.

    
Sign Up
    

{% for category, message in messages %}
• {{ message }}
{% endfor %}

Ihr Code sollte ab diesem Punkt funktionieren, wenn Sie den flask-Befehl mit aktiviertem Debugging ausführen. Dadurch können Sie etwaige Fehler sowohl in der Befehlszeile als auch im Browserfenster sehen:

flask --app app.py --debug run