要實現VIP會員可以觀看影片但普通會員不可以觀看的功能，可以使用Flask作為後端框架，MySQL作為資料庫，HTML和JavaScript作為前端。以下是一個簡單的實現步驟：
-
資料庫設計：
- 建立一個使用者表，包含使用者ID、使用者名稱、密碼、會員型別（VIP或普通）等欄位。
- 建立一個影片表，包含影片ID、影片名稱、影片路徑等欄位。
-
Flask後端：
- 建立Flask應用，設定路由和檢視函式。
- 實現使用者登入和註冊功能。
- 實現影片播放功能，根據使用者型別判斷是否允許播放。
-
HTML和JavaScript前端：
- 建立登入和註冊頁面。
- 建立影片播放頁面，根據後端返回的結果顯示或隱藏影片。
以下是一個簡單的示例程式碼：
資料庫設計
-- 使用者表 CREATE TABLE users ( id INT AUTO_INCREMENT PRIMARY KEY, username VARCHAR(50) NOT NULL, password VARCHAR(100) NOT NULL, role ENUM('VIP', '普通') NOT NULL ); -- 影片表 CREATE TABLE videos ( id INT AUTO_INCREMENT PRIMARY KEY, name VARCHAR(100) NOT NULL, path VARCHAR(255) NOT NULL );
Flask後端
from flask import Flask, request, render_template, redirect, url_for, session import mysql.connector app = Flask(__name__) app.secret_key = 'your_secret_key' # 資料庫連線配置 db = mysql.connector.connect( host="localhost", user="your_username", password="your_password", database="your_database" ) @app.route('/') def index(): return render_template('index.html') @app.route('/login', methods=['GET', 'POST']) def login(): if request.method == 'POST': username = request.form['username'] password = request.form['password'] cursor = db.cursor() cursor.execute("SELECT * FROM users WHERE username = %s AND password = %s", (username, password)) user = cursor.fetchone() if user: session['user_id'] = user[0] session['role'] = user[3] return redirect(url_for('videos')) else: return "登入失敗，請檢查使用者名稱和密碼" return render_template('login.html') @app.route('/videos') def videos(): if 'user_id' not in session: return redirect(url_for('login')) cursor = db.cursor() cursor.execute("SELECT * FROM videos") videos = cursor.fetchall() return render_template('videos.html', videos=videos) @app.route('/play/<int:video_id>') def play(video_id): if 'user_id' not in session: return redirect(url_for('login')) if session['role'] == '普通': return "您不是VIP會員，無法觀看此影片" cursor = db.cursor() cursor.execute("SELECT * FROM videos WHERE id = %s", (video_id,)) video = cursor.fetchone() if video: return render_template('play.html', video=video) else: return "影片不存在" if __name__ == '__main__': app.run(debug=True)
HTML和JavaScript前端
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>首頁</title> </head> <body> <h1>歡迎來到影片網站</h1> <a href="/login">登入</a> </body> </html>
login.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登入</title> </head> <body> <h1>登入</h1> <form action="/login" method="post"> <label for="username">使用者名稱:</label> <input type="text" id="username" name="username"><br><br> <label for="password">密碼:</label> <input type="password" id="password" name="password"><br><br> <input type="submit" value="登入"> </form> </body> </html>
videos.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>影片列表</title> </head> <body> <h1>影片列表</h1> <ul> {% for video in videos %} <li><a href="/play/{{ video[0] }}">{{ video[1] }}</a></li> {% endfor %} </ul> </body> </html>
play.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>播放影片</title> </head> <body> <h1>{{ video[1] }}</h1> <video width="640" height="480" controls> <source src="{{ video[2] }}" type="video/mp4"> 您的瀏覽器不支援 video 標籤。 </video> </body> </html>