Een webapp maken van kras met Python Flask en MySQL deel 2

In het vorige deel van deze serie hebben we kunnen zien hoe we kunnen beginnen met Python Flask en MySQL en het gebruikersregistratiegedeelte van onze applicatie hebben geïmplementeerd. In deze zelfstudie nemen we dit naar een hoger niveau door de inlog- en uitlogfunctionaliteit voor onze toepassing te implementeren.

Ermee beginnen

Kloneer eerst de broncode van de vorige tutorial vanuit GitHub.

git clone https://github.com/jay3dec/PythonFlaskMySQLApp---Part-1.git

Nadat de broncode is gekopieerd, navigeert u naar de PythonFlaskMySQLApp --- Part-1 map en start de server.

python app.py

Richt uw browser op http: // localhost: 5002 en u zou de applicatie moeten laten draaien.

De aanmeldingsinterface maken

Navigeren naar PythonFlaskMySQLApp --- Part-1 / templates en maak een nieuw bestand met de naam signin.html. Open signin.html en voeg de volgende HTML-code toe:

   Python Flask Bucket Lijst App       

Python Flask-app

Bucketlijst-app

© Bedrijf 2015

Open app.py en voeg een nieuwe route toe voor de aanmeldingsinterface.

@ app.route ('/ showSignin') def showSignin (): return render_template ('signin.html') 

Open vervolgens index.html en signup.html, en voeg de href link voor inloggen op beide pagina's als / showSignin. Sla alle wijzigingen op en start de server opnieuw op. 

python app.py

Richt uw browser op http: // localhost: 5002 en klik op de Aanmelden link en u zou de inlogpagina moeten kunnen zien.

Aanmelden implementeren

Nu moeten we een functie maken om de gebruikersaanmelding te valideren. Klikken Aanmelden we zullen het ingevoerde e-mailadres en wachtwoord plaatsen om de gebruikersfunctie te valideren.

Een opgeslagen procedure maken 

Om een ​​gebruiker te valideren, hebben we een opgeslagen MySQL-procedure nodig. Dus maak een MySQL stored procedure zoals getoond:

DELIMITER $$ CREATE DEFINER = "root" @ 'localhost' PROCEDURE 'sp_validateLogin' (IN p_username VARCHAR (20)) BEGIN selecteer * from tbl_user where user_username = p_username; END $$ DELIMITER; 

We krijgen de gebruikersgegevens op basis van de gebruikersnaam uit de MySQL-database met sp_validateLogin. Zodra we het gehashte wachtwoord hebben, zullen we het valideren tegen het wachtwoord dat door de gebruiker is ingevoerd.

Valideer de gebruikersmethode

Maak een methode om de gebruiker te valideren die we zullen bellen wanneer de gebruiker het formulier indient:

@ app.route ('/ validateLogin', methods = ['POST']) def validateLogin (): try: _username = request.form ['inputEmail'] _password = request.form ['inputPassword'] behalve uitzondering als e: return render_template ('error.html', error = str (e)) 

Zoals te zien is in de bovenstaande code, hebben we het geposte e-mailadres en wachtwoord gelezen _username en _wachtwoord. Nu bellen we de sp_validateLogin procedure met de parameter _username. Dus maak een MySQL-verbinding in de validateLogin methode:

con = mysql.connect ()

Nadat de verbinding is gemaakt, maakt u een cursor de ... gebruiken con verbinding.

cursor = con.cursor ()

Gebruik de cursor om de opgeslagen MySQL-procedure aan te roepen, zoals weergegeven:

cursor.callproc ( 'sp_validateLogin', (_ gebruikersnaam,))

Haal de opgehaalde records van de cursor zoals getoond:

data = cursor.fetchall ()

Als de gegevens enkele records bevatten, koppelen we het opgehaalde wachtwoord aan het wachtwoord dat door de gebruiker is ingevoerd.

if len (data)> 0: if check_password_hash (str (data [0] [3]), _ password): return redirect ('/ userHome') else: return render_template ('error.html', error = 'Fout e-mailadres of wachtwoord. ') else: return render_template (' error.html ', error =' Fout e-mailadres of wachtwoord. ')

Zoals te zien is in de bovenstaande code, hebben we een methode gebruikt genaamd check_password_hash om te controleren of het geretourneerde hash-wachtwoord overeenkomt met het door de gebruiker ingevoerde wachtwoord. Als alles in orde is, sturen we de gebruiker door naar userHome.html. En als er een fout is, zullen we weergeven error.html met de foutmelding.

Hier is het complete validateLogin code:

@ app.route ('/ validateLogin', methods = ['POST']) def validateLogin (): try: _username = request.form ['inputEmail'] _password = request.form ['inputPassword'] # connect to mysql con = mysql.connect () cursor = con.cursor () cursor.callproc ('sp_validateLogin', (_ gebruikersnaam,)) data = cursor.fetchall () if len (data)> 0: if check_password_hash (str (data [0] [3]), _ wachtwoord): sessie ['user'] = data [0] [0] return redirect ('/ userHome') else: return render_template ('error.html', error = 'Fout e-mailadres of wachtwoord. ') else: return render_template (' error.html ', error =' Fout e-mailadres of wachtwoord. ') behalve uitzondering als e: return render_template (' error.html ', error = str (e)) eindelijk: cursor.close () con.close () 

Maak een pagina met de naam userHome.html in de map Sjablonen en voeg de volgende HTML-code toe:

   Python Flask Bucket Lijst App      

Python Flask-app

Welkom thuis !!

© Bedrijf 2015

Maak ook een foutpagina genaamd error.html in templates map en voeg de volgende HTML-code toe:

   Onbevoegde toegang :: Python Flask Bucket Lijst App     

Python Flask-app

fout

© Bedrijf 2015

Binnen error.html we hebben een element zoals getoond:

fout

De waarde voor de variabele kan worden doorgegeven vanaf de render_template functie en kan dynamisch worden ingesteld.

Na een succesvolle aanmelding leiden we de gebruiker om naar de startpagina van de gebruiker, dus we moeten een route creëren met de naam / userHome zoals getoond:

@ app.route ('/ userHome') def userHome (): return render_template ('userHome.html') 

Sla alle wijzigingen op en start de server opnieuw op. Klik op de Aanmelden link op de startpagina en probeer in te loggen met een geldig e-mailadres en wachtwoord. Na succesvolle gebruikersvalidatie, zou u een pagina moeten hebben zoals hieronder getoond:

Bij een mislukte gebruikersvalidatie wordt de gebruiker omgeleid naar een foutpagina zoals hieronder getoond:

Hier hebben we een aparte foutpagina gebruikt om de fout weer te geven. Het is ook goed als u dezelfde pagina wilt gebruiken om het foutbericht weer te geven. 

Beperking van ongeoorloofde toegang tot de startpagina van de gebruiker

Na succesvolle gebruikersvalidatie wordt een gebruiker omgeleid naar de startpagina van de gebruiker. Maar op dit moment kan zelfs een niet-geautoriseerde gebruiker de startpagina bekijken door eenvoudigweg te bladeren in de URL http: // localhost: 5002 / userHome. 

Om ongeoorloofde gebruikerstoegang te beperken, zullen we controleren of er een sessievariabele is die we instellen op succesvolle gebruikersaanmelding. Dus importeer sessie van de fles: 

van fles import sessie

We moeten ook een geheime sleutel voor de sessie instellen. Dus in app.py, nadat de app is geïnitialiseerd, stelt u de geheime sleutel in zoals wordt weergegeven:

app.secret_key = 'waarom zou ik je mijn geheime sleutel vertellen?' 

Nu, binnen de validateLogin methode, voordat de gebruiker wordt omgeleid naar / userHome bij succesvol aanmelden, stelt u de sessie variabele zoals getoond:

sessie ['gebruiker'] = data [0] [0]

Vervolgens, binnen de userHome methode, controleer de sessievariabele voordat u deze rendert userHome.html. Als de sessievariabele niet wordt gevonden, leidt u door naar de foutpagina.

@ app.route ('/ userHome') def userHome (): if session.get ('user'): return render_template ('userHome.html') anders: return render_template ('error.html', error = 'Niet-geautoriseerde toegang ') 

Sla alle wijzigingen op en start de server opnieuw op. Probeer zonder in te loggen naar http: // localhost: 5002 / userHome en aangezien u nog niet bent ingelogd, moet u doorgestuurd worden naar de foutpagina.

Uitloggen implementeren

Het implementeren van de uitlogfunctie is het eenvoudigst. Het enige dat we moeten doen is de sessie variabel maken gebruiker null en stuur de gebruiker door naar de hoofdpagina. 

Binnen app.py, maak een nieuwe route en methode voor uitloggen zoals getoond: 

@ app.route ('/ logout') def logout (): session.pop ('gebruiker', Geen) retourneer omleiding ('/') 

We hebben al de href voor de uitlogknop ingesteld op /uitloggen. Dus sla alle wijzigingen op en herstart de server. Klik vanaf de startpagina op Aanmelden en probeer in te loggen met een geldig e-mailadres en wachtwoord. Nadat u bent ingelogd, klikt u op de Uitloggen knop in het home van de gebruiker en je zou succesvol uitgelogd moeten zijn van de applicatie.

Conclusie

In dit deel van de zelfstudie hebben we gezien hoe de gebruikersaanmeldings- en uitlogfunctie te implementeren. We hebben ook gezien hoe ongeautoriseerde toegang tot applicatiepagina's kan worden beperkt. In het volgende deel van deze tutorial zullen we de functionaliteit voor de ingelogde gebruiker implementeren om een ​​blogpost in de applicatie toe te voegen en te bewerken.

Broncode van deze tutorial is beschikbaar op GitHub.

Laat het ons weten in de reacties hieronder!