Implementing Authenticated and Anonymous Session in Flask
Shubham AgrawalLet’s first create a simple web app. Our app will look like:-
Flow of the app will be:-
When you visit
/or/home, you will land at the home page./aboutand/contactare protected endpoints. When you visit/aboutor/contactIf you are not signed-in, you will be redirected to login page. After successful login, a session is created and you will return to the page from where you have come from.
If you are a signed-in user, you will be redirected to the respective page.
When you visit
/products, you will arrive at the products page. No sign-in is required to access this page.When you click on the
Sign Inbutton, a sign-in form will open. After successful login, a session is created and you will be redirected to the Home page.Clicking the
Log Outbutton ends the session and logs the user out of the web app.
Now open VS Code and set up the folders and files as shown below:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web App</title>
<style>
.navbar {
display: flex;
align-items: baseline;
column-gap: 15px;
background-color: antiquewhite;
}
h2 {
margin: 0;
}
a {
text-decoration: none;
}
p {
margin: 0px 0px 0px 35vw;
}
</style>
</head>
<body>
<div class="navbar">
<h2>MyApp</h2>
<a href="{{ url_for('home') }}">Home</a>
<a href="{{ url_for('about') }}">About</a>
<a href="{{ url_for('contact') }}">Contact</a>
<a href="{{ url_for('products') }}">Products</a>
<a href="{{ url_for('login') }}"><button>Sign In</button></a>
<a href="{{ url_for('logout') }}"><button>Log Out</button></a>
{% if session["user_name"] %}
<p>Welcome {{session["user_name"]}}!</p>
{% endif %}
</div>
<hr>
{% block content %}
{% endblock %}
</body>
</html>
home.html
{% extends "index.html" %}
{% block content %}
<main>
<h3>You are at the home page!!</h3>
</main>
{% endblock %}
about.html
{% extends "index.html" %}
{% block content %}
<main>
<h3>You are at the About page!!</h3>
</main>
{% endblock %}
contact.html
{% extends "index.html" %}
{% block content %}
<main>
<h3>You are at the Contact page!!</h3>
</main>
{% endblock %}
products.html
{% extends "index.html" %}
{% block content %}
<main>
<h3>Below are the products that we offer.</h3>
<ul>
<li>Sofas</li>
<li>Chairs</li>
<li>Tables</li>
<li>Swings</li>
</ul>
</main>
{% endblock %}
login.html
{% extends "index.html" %}
{% block content %}
<main>
<h3>Please fill the below form to sign-in!!</h3>
<form action="{{ url_for('login') }}" method="post">
<input type="text" value="{{next}}" name="next" hidden>
<div>
<label for="username">Username</label>
<input type="text" id="username" name="username">
</div>
<div>
<label for="password">Password</label>
<input type="password" id="password">
</div>
<div>
<button type="submit">Submit</button>
</div>
</form>
</main>
{% endblock %}
Here, I will create server-side session to demonstrate how you can make authenticated or anonymous session. You can create client-side authenticated or anonymous session on your own.
Authenticated Session
Here, we will create a session when a user logs into the application.
app.py
from flask import Flask, session, request, redirect, render_template, url_for
from flask_session import Session # Required for server-side session
app = Flask(__name__)
app.config["SECRET_KEY"] = "supersecretkey" # Required for session security
app.config["SESSION_TYPE"] = "filesystem"
Session(app)
@app.route('/')
@app.route('/home')
def home():
return render_template('home.html')
@app.route('/about')
def about():
# checking whether a user is logged in or not
if "user_name" not in session:
return redirect(url_for('login') + f"?next={request.url}")
return render_template('about.html')
@app.route('/contact')
def contact():
# checking whether a user is logged in or not
if "user_name" not in session:
return redirect(url_for('login') + f"?next={request.url}")
return render_template('contact.html')
@app.route('/products')
def products():
return render_template('products.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
next_url = request.args.get("next")
if request.method == 'POST':
# creating session data during login
session["user_name"] = request.form.get('username')
session["lang"] = "en"
session["theme"] = "dark"
next_url = request.form.get("next")
return redirect(next_url if next_url!='None' else url_for("home"))
return render_template('login.html', next=next_url)
@app.route('/logout')
def logout():
session.clear() # clears the session data
return "Signed Out!!!"
if __name__ == '__main__':
app.run(debug=True)
Now open the flask server and visit the web app by clicking the link http://127.0.0.1:5000/.
You will arrive at the home page. Click the Sign In button and log in. Once you are logged in, a server-side authenticated session will be created.
Anonymous Session
Here, a session will still be created even if a user has not logged in.
app.py
from flask import Flask, session, request, redirect, render_template, url_for
from flask_session import Session # Required for server-side session
app = Flask(__name__)
app.config["SECRET_KEY"] = "supersecretkey" # Required for session security
app.config["SESSION_TYPE"] = "filesystem"
Session(app)
@app.route('/')
@app.route('/home')
def home():
# creating session data without login
session["lang"] = "en"
session["theme"] = "dark"
return render_template('home.html')
@app.route('/about')
def about():
# checking whether a user is logged in or not
if "user_name" not in session:
return redirect(url_for('login') + f"?next={request.url}")
return render_template('about.html')
@app.route('/contact')
def contact():
# checking whether a user is logged in or not
if "user_name" not in session:
return redirect(url_for('login') + f"?next={request.url}")
return render_template('contact.html')
@app.route('/products')
def products():
return render_template('products.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
next_url = request.args.get("next")
if request.method == 'POST':
# creating session data during login
session["user_name"] = request.form.get('username')
next_url = request.form.get("next")
return redirect(next_url if next_url!='None' else url_for("home"))
return render_template('login.html', next=next_url)
@app.route('/logout')
def logout():
session.clear() # clears the session data
return "Signed Out!!!"
if __name__ == '__main__':
app.run(debug=True)
Now open the flask server and visit the web app by clicking the link http://127.0.0.1:5000/.
You will arrive at the home page and a server-side anonymous session will be created.
Thank you for your time…😊
Connect with me on LinkedIn
Subscribe to my newsletter
Read articles from Shubham Agrawal directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by