升級成「有資料庫的會員系統」！
這次會教你：
- 安裝 Flask-SQLite 基本版
- 建一個會員資料表 (Users Table)
- 加「註冊功能」→ 把新會員存進資料庫
- 登入時 → 從資料庫查帳密而不是寫死在程式裡
🛠 Step 1：安裝資料庫套件（SQLAlchemy）
Flask 官方建議用 SQLAlchemy 操作資料庫，非常好用。
在 Terminal 打：
pip install flask_sqlalchemy🛠 Step 2：改寫你的 app.py
讓 Flask 跟 SQLite 連線：
from flask import Flask, render_template, request, redirect, session, url_for from flask_sqlalchemy import SQLAlchemy app = Flask(__name__) app.secret_key = '自己設定一組密鑰' app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///users.db' db = SQLAlchemy(app) class User(db.Model): id = db.Column(db.Integer, primary_key=True) username = db.Column(db.String(50), unique=True, nullable=False) password = db.Column(db.String(50), nullable=False) @app.route('/') def index(): return render_template('login.html') @app.route('/signup') def signup(): return render_template('signup.html') @app.route('/signup', methods=['POST']) def signup_post(): username = request.form['username'] password = request.form['password'] existing_user = User.query.filter_by(username=username).first() if existing_user: return redirect(url_for('error', message='帳號已存在')) new_user = User(username=username, password=password) db.session.add(new_user) db.session.commit() return redirect('/') @app.route('/signin', methods=['POST']) def signin(): username = request.form['username'] password = request.form['password'] user = User.query.filter_by(username=username, password=password).first() if user: session['user'] = user.username return redirect('/member') else: return redirect(url_for('error', message='帳號或密碼錯誤')) @app.route('/member') def member(): if 'user' in session: return render_template('member.html') else: return redirect('/') @app.route('/error') def error(): message = request.args.get('message', '發生錯誤') return render_template('error.html', message=message) @app.route('/signout') def signout(): session.pop('user', None) return redirect('/') if __name__ == '__main__': with app.app_context(): db.create_all() app.run(debug=True)
🧩 新增 signup.html
新增一個註冊畫面：
<!DOCTYPE html>
<html>
<head>
<title>註冊</title>
</head>
<body>
<h1>會員註冊</h1>
<form action="/signup" method="post">
<input type="text" name="username" placeholder="帳號" required>
<br><br>
<input type="password" name="password" placeholder="密碼" required>
<br><br>
<button type="submit">註冊</button>
</form>
<br>
<a href="/">回到登入</a>
</body>
</html>
✅ 小總結
| 功能 | 說明 |
|---|---|
| 資料庫 | 用 SQLite 本地建一個 users.db |
| 註冊新會員 | 寫進 User 資料表 |
| 登入檢查帳密 | 用 SQL 查詢而不是寫死在程式碼裡了 |
| 安全性提示 | 目前帳號密碼是明文，未加密（進階版會教你加密） |
🔥 Bonus：資料庫檔案
執行後會產生一個 users.db 的檔案。
如果想用工具打開 .db 看資料，可以下載 DB Browser for SQLite（免費）。
請先 登入 以發表留言。