一：main.py
# -*- coding: utf-8 -*- # @Author : Felix Wang # @time : 2018/7/3 22:58 from flask import Flask, render_template, request, redirect, session, url_for app = Flask(__name__) app.debug = True # 自動重啟 USERS = { 1: {'name': '大白', 'age': '18', 'gender': '男', 'text': '非常可愛'}, 2: {'name': '小白', 'age': '20', 'gender': '男', 'text': '非常暖'}, 3: {'name': '張三', 'age': '21', 'gender': '女', 'text': '天下第一美'}, 4: {'name': '王五', 'age': '20', 'gender': '女', 'text': '帝國理工宅女'}, } @app.route('/detail/<int:nid>', methods=['GET']) # 動態url傳入一個值 def detail(nid): user = session.get('user_info') if not user: url = url_for('l1') # 根據別名生成url return redirect(url) info = USERS[nid] return render_template('detail.html', info=info) # html 文件放在templates文件夾 @app.route('/login', methods=['GET', 'POST'], endpoint='l1') # endpoint 表示別名 def login(): if request.method == 'GET': return render_template('login.html') else: user = request.form.get('user') # 從表單中獲取數據 pwd = request.form.get('pwd') if user == 'alex' and pwd == '123': session['user_info'] = user return redirect('http://www.baidu.com') # 跳轉 return render_template('login.html', error='用戶名或密碼錯誤') # error對應着前面的模板語言error @app.route('/index', methods=['GET']) def index(): user = session.get('user_info') if not user: return redirect('/login') # 跳轉到登錄頁 return render_template('index.html', user_dict=USERS) if __name__ == '__main__': app.run()
二：login.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>用戶登錄</h1> <form method="post"> <input type="text" name="user"> <input type="text" name="pwd"> <input type="submit" value="登錄">{{error}} </form> </body> </html>
三：index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>用戶列表</h1> <table> <!--從字典中循環讀取鍵和值--> {% for k,v in user_dict.items() %} <tr> <td>{{k}}</td> <!--獲取字典中的值有三種--> <td>{{v.name}}</td> <td>{{v['name']}}</td> <td>{{v.get('name')}}</td> <td><a href="/detail/{{k}}">查看詳情</a></td> </tr> <!--結束循環--> {% endfor %} </table> </body> </html>
四：detail.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>詳情信息:{{info.name}}</h1> <div> {{info.text}} </div> </body> </html>