Flask Login/Logout — สร้างระบบ Authentication Systems — Ep.3 — Logout, Message Flashing(Ep สุดท้าย)

จุดประสงค์

  • เข้าใจและสามารถสร้างฟังก์ชันเพื่อทำการ Logout ออกจากระบบได้
  • เข้าใจและสามารถใช้งานการทำ Message Flashing ซึ่งเป็นฟีเจอร์ที่จะช่วยให้ฟีดแบ็คแก่ผู้ใช้ ซึ่งจะช่วยสร้างประสบการณ์การใช้งานของผู้ใช้ (User Experience) ที่ดียิ่งขึ้น
  • ประยุกต์ใช้งาน Bootstrap Alert Cards และสามารถเลือกแสดงผล Message Flashing ให้แจ้งเตือนตามแต่ละประเภทได้ เช่นถ้ามีการลบข้อมูลหรือหรือล็อกอินไม่ถูกต้องให้แจ้งเตือนเป็นการ์ดสีแดง(danger) ถ้ามีการสร้างโพสต์ใหม่หรือล็อกอินสำเร็จให้แจ้งเตือนด้วยการ์ดสีเขียว(success) เป็นต้น

Logout

from flask_login import ... logout_user
# app.py...@app.route("/logout")@login_requireddef logout():
logout_user() return redirect(url_for('login'))...
<a class="dropdown-item" href="{{url_for('logout')}}">Log out</a>

กำหนดการแสดงผล Login, Logout และ Sign up ใน Dropdown

  • แสดงผลเฉพาะ Log in กับ Sign up เท่านั้น จะไม่ให้แสดงผล Log out เนื่องจากว่า User ยังไม่ได้ล็อกอิน ดังนั้นไม่จึงไม่ make sense ที่จะแสดง Log out
  • แสดงผล Log out เท่านั้นเมื่อ User มีการล็อกอินเข้าใช้งานแล้ว
  • ถ้า User ยังไม่ได้ล็อกอิน ให้แสดงผล Sign up และ Log in
  • ถ้า User ล็อกอินเรียบร้อย ให้แสดงผลเฉพาะ Log out
<!-- base.html -->...<div class="dropdown-menu" aria-labelledby="navbarDropdown">  {% if current_user.is_authenticated %}    <a class="dropdown-item" href="/logout">Log out</a>  {% else %}    <a class="dropdown-item" href="{{url_for('login')}}">Log in</a>    <div class="dropdown-divider"></div>      <a class="dropdown-item" href="{{url_for('sign_up')}}">Sign up</a>  {% endif %}</div>...
ผู้ใช้ยังไม่ได้ทำการล็อกอิน
เมื่อผู้ใช้ทำการล็อกอินเข้ามาเรียบร้อย

Message Flashing

Flash Message
from flask import ... flash<!-- base.html -->...{% with messages = get_flashed_messages() %}  {% if messages %}    <ul class=flashes>      {% for message in messages %}        <li>{{ message }}</li>      {% endfor %}    </ul>  {% endif %}{% endwith %}
...
flash เพื่อแสดงผลข้อความออกมาได้แล้ว แต่ยังดูธรรมดา ราบเรียบเกินไป
ฺBootstrap Alert

Flash ตาม Category

flash(“Successful Login”)
flash(“Successful Login”, "success")
<div class="alert alert-{{ category }}" role="alert">{{ message }}</div>
Successful Login
flash(“Invalid Login”, "danger")
Invalid Login
get_flashed_messages(with_categories=true )
{% for category, message in messages %}
<div class="alert alert-{{ category }}" role="alert">{{ message }}</div>
<!-- base.html -->...<div class='container' style="text-align: center;">  <hr>  {% with messages = get_flashed_messages(with_categories=true) %}    {% if messages %}      {% for category, message in messages %}        <div class="alert alert-{{ category }}" role="alert">          {{ message }}        </div>      {% endfor %}    {% endif %}  {% endwith %}</div>...
base.html

สำหรับ Flask-Login Ep.3 ซึ่งเป็นตอนสุดท้าย ก็ขอจบลงเพียงเท่านี้ครับ ถ้ามีคำถามหรือข้อสงสัยหรือไม่เข้าใจตรงไหนก็คอมเมนต์ได้ที่ด้านล่างบทความกันได้เลยครับ หรือถ้าอยากติชมหรือมีอะไรเสนอแนะก็คอมเมนต์เข้ามาได้เช่นกันครับ

--

--

--

Full Stack Python Developers

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
stackpython

stackpython

Full Stack Python Developers

More from Medium

Postgres replica conflicts: Part 2

Hybrid Spatial Data Structures: Quad-KD and R-KD trees

Working with Json Data using Lodash and NodeJs

Application Framework