sales@arkayapps.com
+91 932-709-3554
Inquiry Now
  • Home
  • Portfolio
  • Products
  • Services
    • Mobile App Development
    • Web Design and Development
    • Digital Ocean Services
  • Blog
  • Get in Touch
  • Home
  • Portfolio
  • Products
  • Services
    • Mobile App Development
    • Web Design and Development
    • Digital Ocean Services
  • Blog
  • Get in Touch
  • Home
  • Portfolio
  • Products
  • Services
    • Mobile App Development
    • Web Design and Development
    • Digital Ocean Services
  • Blog
  • Get in Touch
  • Home
  • Portfolio
  • Products
  • Services
    • Mobile App Development
    • Web Design and Development
    • Digital Ocean Services
  • Blog
  • Get in Touch
Blog
Home Flask User Authentication with Python Flask and MySQL
FlaskPython

User Authentication with Python Flask and MySQL

Zeel Pandya Zeel Pandya June 16, 2020 0 Comments

In the following blog, I am going to demonstrate a Login system using Python Flask and MySQL. I’m also covering the basics of Flask and common practices.

 

Table of content

  • Introduction to flask
  • Understanding user authentication and why it is important?
  • Let’s start
  • Creating the main application file
  • Adding Routes
  • Creating templates
  • Connection to the MySQL database
  • Adding the Login Method
  • Adding Logout Method
  • Preventing Direct Navigation
  • Output
  • Conclusion

Introduction to Flask

If you are thinking of developing a web application in Python, then the first thing that comes into your mind is a framework, and if it is so, then the Flask is the answer to your question.

Flask is light-weight Python framework developed by “Armin Ronacher”. werkzeug WSGI toolkit and jinja2 template engines are the main pillars of the flask framework.

 

Understanding user authentication and why it is important?

We all undergo the process of authentication initially, whenever we try to navigate to any website or using any mobile Apps, Web applications.

Logins are the set of credentials, which provide the security to prevent unauthorized access to data, and also verify the user’s identity.

 

Let’s start

Let’s start by installing the necessary packages.

 

Shell
1
sudo apt install python3-virtualenv

Python3 comes with a venv module to create virtual environments, which are independent groups of Python libraries, one for each project. Packages installed for one project will not influence other projects.

 

MS DOS
1
pip3 install flask

The above command will install the Flask module in your project.

 

MS DOS
1
pip3 install flask-mysqldb

flask-mysqldb helps you to connect and interact with the MySQL database.

 

MS DOS
1
pip install flask-bcrypt

This module is used for password hashing.

 

Creating the main application file

create an app.py file in your project folder and write the following code.

1
2
3
4
5
from flask import Flask, render_template
app = Flask(__name__)
 
if __name__ == '__main__':
  app.run(host='127.0.0.1', port=8000, debug=True)

This code will host our application on 127.0.0.1 which is localhost with port number 8000. By default, the port number is 5000.

If you change to debug mode as True, the server will reload itself on code changes, you no need to restart the server after every change into the code.

 

Adding Routes

1
2
3
4
5
6
7
8
9
10
11
12
13
from flask import Flask, render_template
app = Flask(__name__)
 
@app.route('/')
def root():
  return render_template('login.html')
 
@app.route('/home')
def home():
  return render_template('home.html')
 
if __name__ == '__main__':
  app.run(host='127.0.0.1', port=8000, debug=True)

here, the (‘/’) route is bound with the login method, so whenever we navigate to that route the login method will render automatically. Same, with the home route.

 

Creating templates

create templates folder in your project and add all Html files to that folder because Flask will try to find your Html file in this folder.

  • Project Folder
    • app.py
    • templates
      • login.html
      • home.html

Login.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html>
<head>
    {% with messages = get_flashed_messages() %}  
    {% if messages %}  
          {% for message in messages %}  
               <p style="text-align: center; color: #9C27B0;">{{ message }}</p>  
          {% endfor %}  
    {% endif %}  
    {% endwith %}
</head>
<body>
    <div class="main">
        <p class="sign" align="center">Login</p>
        <form class="form1" action="{{url_for('authenticate')}}" method="POST">
            <input class="un " type="text" align="center" placeholder="Username" name="username" required>
            <input class="pass" type="password" align="center" placeholder="Password" name="password" required>
            <button class="submit" type="submit">Login</button>
        </form>
    </div>  
</body>
</html>

 

Home.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html lang="en">
<head>
   <title>Home</title>
</head>
<body>
   <form action="{{url_for('logout')}}" >
       <div class="main">
           <h2 style="text-align: center; margin-top: 25px; color: rgb(85, 12, 124); padding-top: 25px;">Welcome {{uname}}</h2>
           <button class="submit" type="submit" style="margin-top: 25px;">Logout</button>
       </div>
   </form>
</body>
</html>

Full source code for Login.html and Home.html is available on GitHub

 

Connection to the MySQL database

Add this code to app.py file

1
2
3
4
5
6
7
8
9
10
from flask_mysqldb import MySQL
 
app = Flask(__name__)
 
app.config['MYSQL_HOST'] ='localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = 'your password'
app.config['MYSQL_DB'] = 'name of your database'
 
mysql = MySQL(app)

 

Adding Authenticate Method

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
from flask_bcrypt import Bcrypt
 
import os
 
bcrypt = Bcrypt()
 
@app.route('/authentication',methods=['POST','GET'])
 
def authenticate():
 
   if request.method == 'POST':
       uname = request.form['username']
       passwrd = request.form['password']   
 
       cur = mysql.connection.cursor()
       cur.execute("SELECT username,password FROM user WHERE username=%s",[uname])
       user = cur.fetchone()
       temp = user[1]
 
       if len(user) > 0:
           session.pop('username',None)
           if (bcrypt.check_password_hash(temp,passwrd)) == True:  
               session['username'] = request.form['username']
               return render_template('home.html',uname=uname)
           else:
               flash('Invalid Username or Password !!')
               return render_template('login.html')
   else:
       return render_template('login.html')
 
if __name__ == '__main__':
    app.secret_key = os.urandom(24)
    app.run(host='127.0.0.1', port=8000, debug=True)

The check_password_hash of bcrypt will check the existing password hash against the currently generated password hash , In our case if temp and passwrd will match then it returns True . otherwise returns False.

session.pop() method is used to release a session variable . in our case “username is our session variable . so we will set it to None.

The Session data is stored on top of cookies and the server signs them cryptographically. For this encryption, a Flask application needs a defined SECRET_KEY.  app.secret_key = os.urandom(24) will return a 24 character long string of random numbers.

 

Adding Logout Method

1
2
3
4
@app.route('/logout')
def logout():
    session.clear()
    return render_template('login.html')

 

Preventing Direct Navigation

In this step, we will restrict a user to access URL to any other pages without login.

For e.g. If any user tries to access localhost:8000/home without login, we can put any error message and the user will remain to the login page.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
from flask import Flask , render_template,request,url_for,redirect,session,flash,g
 
@app.before_request
 
def before_request():
 
g.username = None
 
 
if 'username' in session:
 
g.username = session['username']
 
@app.route('/home')
 
def home():
   if g.username:
       return render_template('home.html')
   else:
       return render_template('login.html')

Here we will check whether “username”  variable is set or not , if the variable is set to session then the user can move to the home page . otherwise user will remain navigate to login page

Here is the final code for app.py file

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
from flask import Flask,render_template,request,url_for,redirect,session,flash,g
from flask_mysqldb import MySQL
from flask_bcrypt import Bcrypt
import os
 
app = Flask(__name__)
 
app.config['MYSQL_HOST'] ='localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = 'password'
app.config['MYSQL_DB'] = 'user'
 
mysql = MySQL(app)
bcrypt = Bcrypt()
 
@app.before_request
def before_request():
   g.username = None
   if 'username' in session:
       g.username = session['username']
 
@app.route('/')
def root():
   return render_template('login.html')
 
@app.route('/authentication',methods=['POST','GET'])
def authenticate():
   if request.method == 'POST':
       uname = request.form['username']
       passwrd = request.form['password']   
       cur = mysql.connection.cursor()
       cur.execute("SELECT username,password FROM user WHERE username=%s",[uname])
       user = cur.fetchone()
       temp = user[1]
       if len(user) > 0:
           session.pop('username',None)
           if (bcrypt.check_password_hash(temp,passwrd)) == True:  
               session['username'] = request.form['username']
               return render_template('home.html',uname=uname)
           else:
               flash('Invalid Username or Password !!')
               return render_template('login.html')
   else:
       return render_template('login.html')
 
@app.route('/home')
def home():
   if g.username:
       return render_template('home.html')
   else:
       return render_template('login.html')
 
@app.route('/logout')
def logout():
   session.clear()
   return render_template('login.html')
 
if __name__ == '__main__':
    app.secret_key = os.urandom(24)
    app.run(host='127.0.0.1', port=8000, debug=True)

 

Output

 

 

Full source code is available on GitHub

 

Conclusion

By following this article one can have basic knowledge of flask and also be able to accomplish basic tasks such as authentication for a web app.

I will try to cover more such topics in upcoming blogs

References

https://speckyboy.com/login-pages-html5-css/

https://www.maartenbaert.be/simplescreenrecorder/

Authentication Flask MySQL Python
69
844 Views
Zeel Pandya
AboutZeel Pandya
Zeel is a zealous developer who is working with Backend technologies and API development. Proactive attitude, effective communication, and flexibility enabled her to look at problems from a broad perspective. She has some experience with python, React.js, embedded system, and UI/UX. She is also a competitive programmer who actively participates in different code challenges. She loves learning about anything, especially if it makes her better at her craft.
Why We Love QuickDBD Tool for Database DesignPrevWhy We Love QuickDBD Tool for Database DesignJanuary 31, 2020
People & Identity - Conversation notifications new features!July 4, 2020People & Identity - Conversation notifications new features!Next

Related Posts

FlaskPython

User Authentication with Python Flask and MySQL

In the following blog, I am going to demonstrate a Login system using Python...

Zeel Pandya Zeel Pandya June 16, 2020
Categories
  • Android 3
  • Cloud Server 5
  • Database 1
  • Digital Marketing 1
  • Education 2
  • Flask 1
  • Graphic Design 1
  • Python 1
  • Ready Mix Concrete ERP Software 1
  • SEO 2
  • Startup Idea 3
  • Version Control 1
  • Web Designing 2
  • Web Development 2
  • WordPress 2
Recent Posts
  • Ready Mix Concrete ERP: Customise Ready Mixed Concrete ERP Software
  • Global Downfall, crises and opportunities in EdTech
  • What Makes a Photo editing app a Desirable One?
  • New Ideas for Educational App Startups that should check out in 2020
  • People & Identity – Conversation notifications new features!
Recent Comments
  • Arkay Apps on GK In Gujarati
  • Arkay Apps on Property Or Real Estate Listing Android App Source Code
  • Arkay Apps on Property Or Real Estate Listing Android App Source Code
  • Darty Mulimaposho on Property Or Real Estate Listing Android App Source Code
  • Arkay Apps on GK In Gujarati
For Work Inquiry
Email: sales@arkayapps.com
India: +91 932-709-3554
For Career Inquiry
Email: career@arkayapps.com
India: +91 932-709-3554
Bhuj
 174, Time Square Empire, SH 42 Mirjapar Highway, Bhuj, Gujarat 370001
Email: info@arkayapps.com
Phone: +91 932-709-3554
Bengaluru
No.3, Silver Palms, Palmgrove Rd, Victoria Layout, Bengaluru, Karnataka - 560047
Email: info@arkayapps.com
Phone: ‭+91 804-377-9545‬
U.S.A
20128 Bar Garbor Terrace
Ashburn
VA 20147, USA
Email: info@arkayapps.com
Privacy Policy | Kids App Privacy Policy | Disclaimer

Copyright © 2020 by Arkay Apps. All Rights Reserved.

We use cookies to ensure that we give you the best experience on our website. By continuing the site you are agreeing to cookies. Privacy policyOkay