Lihat sumber Manajemen Autentikasi dan Otorisasi

Dalam pengembangan aplikasi web, autentikasi dan otorisasi adalah dua komponen penting untuk memastikan bahwa hanya pengguna yang sah yang dapat mengakses sumber daya tertentu. Autentikasi memverifikasi identitas pengguna, sementara otorisasi menentukan hak akses pengguna tersebut terhadap sumber daya dalam aplikasi. Flask, sebagai salah satu framework web Python yang ringan, menyediakan ekstensi seperti Flask-Login untuk mempermudah implementasi sistem login dan kontrol akses pengguna. Modul ini akan membahas cara mengimplementasikan sistem autentikasi dan otorisasi menggunakan Flask-Login, dengan contoh konkret dan langkah-langkah yang dapat diterapkan pada sistem operasi Ubuntu 24.04.

==Instalasi Flask dan Flask-Login di Ubuntu 24.04==

Sebelum memulai, pastikan bahwa Python 3 dan pip telah terinstal di sistem Anda. Berikut adalah langkah-langkah untuk menginstal Flask dan Flask-Login:

1. '''Perbarui daftar paket dan instal dependensi yang diperlukan:'''
   
 sudo apt update
 sudo apt install python3 python3-pip python3-venv -y

2. '''Buat direktori proyek dan navigasikan ke dalamnya:'''
   
 mkdir flask_auth
 cd flask_auth

3. '''Buat dan aktifkan virtual environment:'''
   
 python3 -m venv venv
 source venv/bin/activate
   

4. '''Instal Flask dan Flask-Login:'''
   
 pip install Flask Flask-Login Flask-SQLAlchemy

==Konfigurasi Aplikasi Flask==

Setelah instalasi, kita akan mengkonfigurasi aplikasi Flask dan mengintegrasikan Flask-Login untuk manajemen sesi pengguna.

1. '''Buat file `app.py` dan tambahkan kode berikut:'''
  
 from flask import Flask, render_template, redirect, url_for, request, flash
 from flask_sqlalchemy import SQLAlchemy
 from flask_login import LoginManager, UserMixin, login_user, login_required, logout_user, current_user
 from werkzeug.security import generate_password_hash, check_password_hash
 
 app = Flask(__name__)
 app.config['SECRET_KEY'] = 'kunci_rahasia_anda'
 app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///users.db'
 db = SQLAlchemy(app)
 login_manager = LoginManager()
 login_manager.init_app(app)
 login_manager.login_view = 'login'
   
Kode di atas mengatur aplikasi Flask dengan kunci rahasia untuk sesi, mengkonfigurasi SQLAlchemy untuk menggunakan basis data SQLite, dan menginisialisasi Flask-Login dengan menentukan tampilan login default.

2. '''Definisikan model pengguna:'''
   
 class User(UserMixin, db.Model):
     id = db.Column(db.Integer, primary_key=True)
     username = db.Column(db.String(150), unique=True, nullable=False)
     password = db.Column(db.String(150), nullable=False)
 
Model `User` di atas memiliki kolom `id`, `username`, dan `password`. `UserMixin` menyediakan implementasi default untuk metode yang diperlukan oleh Flask-Login.

3. '''Buat tabel basis data:'''

Sebelum membuat tabel, pastikan Anda berada dalam konteks aplikasi:
 
 with app.app_context():
     db.create_all()
   

Kode ini akan membuat tabel `User` dalam basis data sesuai dengan model yang telah didefinisikan.

==Implementasi Sistem Login==

Selanjutnya, kita akan mengimplementasikan sistem login dengan Flask-Login.

1. '''Fungsi pemuat pengguna:'''

Flask-Login memerlukan fungsi untuk memuat pengguna berdasarkan ID. Tambahkan kode berikut:
  
 @login_manager.user_loader
 def load_user(user_id):
     return User.query.get(int(user_id))
  
2. '''Route untuk registrasi pengguna:'''

Tambahkan route untuk registrasi pengguna baru:
   
 @app.route('/register', methods=['GET', 'POST'])
 def register():
     if request.method == 'POST':
         username = request.form.get('username')
         password = request.form.get('password')
         hashed_password = generate_password_hash(password, method='sha256')
         new_user = User(username=username, password=hashed_password)
         db.session.add(new_user)
         db.session.commit()
         flash('Akun berhasil dibuat!', 'success')
         return redirect(url_for('login'))
     return render_template('register.html')
  
Dalam route ini, jika metode permintaan adalah POST, aplikasi akan mengambil `username` dan `password` dari formulir, mengenkripsi password, dan menyimpan pengguna baru ke dalam basis data.

3. '''Route untuk login pengguna:'''

Tambahkan route untuk login:
  
 @app.route('/login', methods=['GET', 'POST'])
 def login():
     if request.method == 'POST':
         username = request.form.get('username')
         password = request.form.get('password')
         user = User.query.filter_by(username=username).first()
         if user and check_password_hash(user.password, password):
             login_user(user)
             flash('Login berhasil!', 'success')
             return redirect(url_for('dashboard'))
         else:
             flash('Login gagal. Periksa kembali username dan password Anda.', 'danger')
     return render_template('login.html')
   
Route ini memverifikasi kredensial pengguna dan, jika valid, memulai sesi pengguna.

4. '''Route untuk dashboard yang dilindungi:'''

Tambahkan route untuk dashboard yang hanya dapat diakses oleh pengguna yang telah login:
 
 @app.route('/dashboard')
 @login_required
 def dashboard():
     return f'Halo, {current_user.username}! Selamat datang di dashboard.'
  
Dekorator `@login_required` memastikan bahwa hanya pengguna yang telah login yang dapat mengakses route ini.

5. '''Route untuk logout pengguna:'''

Tambahkan route untuk logout:
   
 @app.route('/logout')
 @login_required
 def logout():
     logout_user()
     flash('Anda telah logout.', 'info')
     return redirect(url_for('login'))
   
Route ini mengakhiri sesi pengguna dan mengarahkan kembali ke halaman login.

Melanjutkan pembahasan sebelumnya mengenai implementasi sistem autentikasi dan otorisasi dalam aplikasi Flask menggunakan Flask-Login, berikut adalah langkah-langkah untuk membuat template HTML yang mendukung fitur registrasi dan login pengguna.

==1. Struktur Direktori Proyek==

Pastikan struktur direktori proyek Anda seperti berikut:

 Flask_auth/
 ├── app.py
 ├── templates/
 │   ├── base.html
 │   ├── register.html
 │   └── login.html
 └── venv/

==2. Template Dasar (`base.html`)==

Buat file `base.html` di dalam folder `templates` yang akan menjadi template dasar untuk halaman lainnya:

<pre>
 <!DOCTYPE html>
 <html lang="id">
 <head>
     <meta charset="UTF-8">
     <title>{% block title %}{% endblock %} - Aplikasi Flask</title>
     <style>
         body {
             font-family: Arial, sans-serif;
         }
         .container {
             width: 50%;
             margin: auto;
         }
         .flash {
             color: red;
         }
     </style>
 </head>
 <body>
     <div class="container">
         {% with messages = get_flashed_messages(with_categories=true) %}
             {% if messages %}
                 {% for category, message in messages %}
                     <div class="flash">{{ message }}</div>
                 {% endfor %}
             {% endif %}
         {% endwith %}
         {% block content %}{% endblock %}
     </div>
 </body>
 </html>
</pre>


Template ini menyediakan struktur dasar dengan area untuk menampilkan pesan flash dan konten spesifik halaman.

==3. Template Registrasi (`register.html`)==

Buat file `register.html` di dalam folder `templates` dengan konten berikut:

<pre>
 {% extends "base.html" %}
 
 {% block title %}Registrasi{% endblock %}
 
 {% block content %}
 <h2>Registrasi Pengguna Baru</h2>
 <form method="POST">
     <label for="username">Nama Pengguna:</label><br>
     <input type="text" id="username" name="username" required><br><br>
     <label for="password">Kata Sandi:</label><br>
     <input type="password" id="password" name="password" required><br><br>
     <button type="submit">Daftar</button>
 </form>
 <p>Sudah memiliki akun? <a href="{{ url_for('login') }}">Masuk di sini</a>.</p>
 {% endblock %} 
</pre>

Template ini menyediakan formulir untuk registrasi pengguna baru dengan field `username` dan `password`.

==4. Template Login (`login.html`)==

Buat file `login.html` di dalam folder `templates` dengan konten berikut:

<pre>
 {% extends "base.html" %}
 
 {% block title %}Masuk{% endblock %}
 
 {% block content %}
 <h2>Masuk</h2>
 <form method="POST">
     <label for="username">Nama Pengguna:</label><br>
     <input type="text" id="username" name="username" required><br><br>
     <label for="password">Kata Sandi:</label><br>
     <input type="password" id="password" name="password" required><br><br>
     <button type="submit">Masuk</button>
 </form>
 <p>Belum memiliki akun? <a href="{{ url_for('register') }}">Daftar di sini</a>.</p>
 {% endblock %} 
</pre>

Template ini menyediakan formulir untuk login pengguna dengan field `username` dan `password`.

==5. Menjalankan Aplikasi==

Setelah semua file dan kode di atas disiapkan, Anda dapat menjalankan aplikasi Flask dengan perintah berikut:

 python app.py

Akses aplikasi melalui browser di `http://127.0.0.1:5000/`. Anda dapat mendaftar pengguna baru melalui halaman registrasi dan kemudian masuk menggunakan kredensial yang telah didaftarkan.

==6. Catatan Keamanan==

* '''Penyimpanan Kata Sandi:''' Pastikan untuk selalu menyimpan kata sandi dalam bentuk yang telah di-hash menggunakan algoritma yang aman. Jangan pernah menyimpan kata sandi dalam bentuk teks biasa.
* '''Validasi Input:''' Lakukan validasi input pada sisi server untuk mencegah serangan seperti SQL Injection atau Cross-Site Scripting (XSS).
* '''Proteksi CSRF:''' Gunakan token CSRF untuk melindungi aplikasi dari serangan Cross-Site Request Forgery.

Dengan mengikuti langkah-langkah di atas, Anda telah mengimplementasikan sistem autentikasi dan otorisasi dasar dalam aplikasi Flask menggunakan Flask-Login. Untuk pengembangan lebih lanjut, pertimbangkan untuk menambahkan fitur seperti reset kata sandi, verifikasi email, dan otorisasi berbasis peran untuk meningkatkan keamanan dan fungsionalitas aplikasi Anda.

==Pranala Menarik==

* [[Web Programming]]