Flask&&人工智能AI --1

時間 2019-12-07

標籤 flask 人工智能欄目 Python 简体版

原文原文鏈接

Flask初識,Response三劍客,jsonify以及send_file、Request,模板語言 Jinja2,用戶登陸例子,內置Sessiohtml

1、Flask初識

首先,要看你學沒學過Django 若是學過Django 的同窗,請從頭看到尾,若是沒有學過Django的同窗,而且不想學習Django的同窗,輕饒過第一部分前端

三大主流Web框架對比

一、Django：

　　優勢：大而全，集成了不少組件，Models Admin Form 等等, 無論你用獲得用不到,反正它全都有,屬於全能型框架；django一般用於大型Web引用，因爲內置組件足夠強大，因此使用Django開發能夠一鼓作氣web

　　缺點：這麼多資源一次性加載會形成一部分資源浪費django

二、Flask：

　　優勢：小而輕，原生組件幾乎爲0，三方提供的組建請參開Django很是全面，屬於短小精悍型框架；一般應用於小型應用和快速構建應用，其強大的三方庫，足以支撐一個大型的Web應用json

　　缺點：穩定性相對較差flask

三、Tornado

　　優勢：原生異步非阻塞，在IO密集型應用型和多任務處理上佔據絕對性的優點，屬於專一型框架；一般用於API後端應用，遊戲服務後臺，其內部四線的異步非阻塞老穩了。後端

　　缺點：乾淨，三方及原生組件幾乎爲0，連個session都不支持瀏覽器

Flask 的安裝與HelloWorld

Flask的安裝特別難,可是鄙人很懶,確定會找出一個最簡單的方法教大家,具體操做以下:安全

pip install Flask

別問我還有沒有複雜的方法,沒有!服務器

Flask安裝完成了,下面使用Flask走一遍儀式:

三行Flask

from flask import Flask
app=Flask(__name__)
app.run()

執行輸出：

 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)

默認端口是5000，訪問頁面：

由於沒有定義路由，因此報404。可是服務是起來了！

六行Flask

from flask import Flask
app = Flask(__name__)
@app.route("/")
def index():
    return "HelloWord!"
app.run()

重啓程序，刷新頁面

實現了Flask的第一個HelloWord程序

解讀一下代碼：

from flask import Flask    #導入flask類
app = Flask(__name__)  #實例化Flask對象app
@app.route("/")    #app中的route裝飾器
def index():    #視圖函數
    return "HelloWord!"   #返回響應體

# 監聽地址爲0.0.0.0,表示服務器的全部網卡
# 5000是監聽端口
# debug=True表示啓動debug模式。當代碼有改動時,Flask會自動加載,無序重啓！
app.run("0.0.0.0",5000,debug=True)  # 啓動Flask服務

注意：！！！默認的debug模式是關閉的。若有代碼改動，須要重啓flask才能生效！可是開啓的debug模式，代碼必定有改動，會馬上加載，無需重啓！！！

還有一點，app = Flask(__name__) 這裏面的__name__ 表示標識模塊的名字的一個系統變量還能夠是app=Flask（」dsds「），這樣運行也沒有問題。那麼爲何要用__name__呢？後面學習到藍圖會用到！

啓動了Flask,獲得了返回值,打印在頁面上

本文參考：

http://www.javashuo.com/article/p-xyorgmoh-km.html

2、Response三劍客 -- render、redirect、HttpResponse

HttpResponse

在Flask中的HttpResponse，其實就是返回字符串至客戶端

@app.route("/")  # app中的route裝飾器
def index():  # 視圖函數
    return "HelloWorld!!"  # HttpResponse

Redirect

from flask import Flask  # 導入Flask類
from flask import redirect  # 導入flask中的redirect

app = Flask(__name__)


# app中的route裝飾器,用來指定視圖函數的URL地址
@app.route("/redi")
def redi():  # 視圖函數
    return redirect("/")  # redirect跳轉至"/"


@app.route("/")
def index():  # 視圖函數
    return "hello"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

每當訪問"/redi"這個地址的時候,視圖函數redi會觸發redirect("/") 跳轉到url地址: "/" 並會觸發"/"對應的視圖函數index()

訪問url: http://127.0.0.1:5000/redi

查看網頁工具，查看網絡。它經歷了2次請求！

render (render_template)

編輯文件demo.py，代碼以下

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template

app = Flask(__name__)


@app.route("/home")
def home():  # 視圖函數
    # 渲染html模板,返回html頁面
    return render_template("home.html")


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

在當前py文件目錄中建立templates，在此目錄下建立文件home.hml

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>Flask</h1>
</body>
</html>

重啓flask，訪問home頁面，效果以下：

目錄結果以下：

./
├── demo.py
└── templates
    └── home.html——

HTML模板渲染是每一個Web框架中都必須有的，至於render_template的具體用法，留個懸念，日後看

注意：若是要使用render_template返回渲染的模板，請在項目得主目錄中加入一個目錄remplates

不然可能會有一個jinja2的異常

遇到上述的問題,基本上就是你的template的路徑問題

爲何要必定要建立templates文件夾呢？叫abc，行不行呢？不行！

看這一行代碼

app = Flask(__name__)

使用Ctrl+鼠標左鍵，點擊Falsk，查看源碼

def __init__(
    self,
    import_name,
    static_url_path=None,
    static_folder='static',
    static_host=None,
    host_matching=False,
    subdomain_matching=False,
    template_folder='templates',
    instance_path=None,
    instance_relative_config=False,
    root_path=None
):

View Code

看到template_folder變量沒有？文件必須叫這個名字~

指定templates路徑

注意：個人flask程序，是直接用新建py文件寫的。因此這一行代碼，會飄黃

return render_template("home.html")

怎麼解決呢？很簡單！執行目錄就行了

右鍵templates文件夾-->Mark Directory as-->Template Folder

選擇yes

選擇Jinja2，Flask中默認的模板語言是Jinja2

django的模板語言爲django，其實django底層也是用Jinja2開發的。其餘模板語言同理！

後續會講到flaks模板語法，你會發現，和django幾乎是同樣的！

注意：若是直接使用Pycharm建立Flask項目，是不存在這個問題的！

前期學習Flask，要先本身手動折騰，後期就能夠用Pycharm建立了！

本文參考連接：
http://www.javashuo.com/article/p-xssryktw-mw.html

3、Flask中小兒子 -- jsonify以及send_file

4、Request

from flask import request
request.method  #請求方式
request.form  #存放FromData中的數據to_dict序列化成字典
request.args  #獲取URL中的數據to_dict序列化字典
request.url  #訪問的完整路徑
request.path  #路由地址
request.host  #主機地址
request.values  #獲取FormData  and  URL中的數據 ，不要用to_dict
request.json  #若是提交時請求頭中的Content-Type:accplication/json字典操做
request.data  #若是提交時請求頭中的Content-Type沒法被識破，將請求體中的原始數據存放byte
request.cookies  #獲取Cookie中的數據
request.headers  #獲取請求頭
request。files #序列化文件存儲save（）

每一個框架中都有處理請求的機制(request),可是每一個框架的處理方式和機制是不一樣的

爲了瞭解Flask的request中都有什麼東西,首先咱們要寫一個先後端的交互

基於HTML + Flask 寫一段先後端的交互

先寫一段兒HTML form表單中提交方式是post action地址是 /req

在templates目錄建立文件login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>login</title>
</head>
<body>
<h1>歡迎登陸</h1>
<form action="/req" method="post" enctype="multipart/form-data">
    <p>
        <input type="text" name="username" placeholder="請輸入用戶名">
    </p>
    <p>
        <input type="text" name="password" placeholder="請輸入用戶密碼">
    </p>
    <input type="submit" value="提交">
</form>
</body>
</html>

寫好一個標準 form 表單,一點提交,搜就向後端提交一個POST請求過去了

後端的接收方式就 666 了

首先要從 flask 包中導入 request 模塊 , 至於爲何要導入 request 呢? 這裏不作解釋,暫時你就知道 request 若是要用,須要導入

demo.py

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req")
def home():  # 視圖函數
    print(request)
    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

重啓flask，訪問登陸頁面

提示以後，報錯！提示請求方式不被容許！

methods

爲何呢？由於默認路由只容許GET訪問。那麼須要加一個參數methods，容許POST訪問

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req",methods=["POST"])  # 只容許POST
def home():  # 視圖函數
    print(request)  # request對象
    print(request.method)  # POST看來可使用這種方式來驗證請求方式
    # ImmutableMultiDict([('user', 'xiao'), ('pwd', '123')])
    print(request.form)
    # ImmutableMultiDict 它看起來像是Dict,使用字典方式取值
    print(request.form["user"])  # xiao
    print(request.form.get("pwd"))  # 123
    # 字典迭代器對象,keys表示獲取全部值
    print(request.form.keys())
    # 既然是迭代器,就可使用for循環了
    for i in request.form.keys():
        print(i)

    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

從新提交一次，就能夠了！

查看Pycharm控制檯輸出：

<Request 'http://127.0.0.1:5000/req' [POST]>
POST
ImmutableMultiDict([('user', 'xiao'), ('pwd', '123')])
xiao
<dict_keyiterator object at 0x0000027BF603FAE8>
user
pwd

View Code

解釋一個 @app.route("/req",methods=["POST"]) :

methods=["POST"] 表明這個url地址只容許 POST 請求,是個列表也就是意味着能夠容許多重請求方式,例如GET之類的

request.method

1.request.method 之確定知道前端用什麼方式提交的

Flask 的 request 中給咱們提供了一個 method 屬性裏面保存的就是前端的請求的方式

print(request.method) # POST 看來可使用這種方式來驗證請求方式

request.form

2.request.form 之拿他來舉例的話再好不過了

Form表單中傳遞過來的值,使用request.form中拿到

print(request.form)  # ImmutableMultiDict([('user', 'xiao'), ('pwd', '123')])
# ImmutableMultiDict 它看起來像是的Dict 就用Dict的方法取值試一下吧
print(request.form["user"])  # xiao
print(request.form.get("pwd"))  # 123
# 看來所有才對了, ImmutableMultiDict 彷佛就是個字典,再來玩一玩它
print(list(request.form.keys()))  # ['user', 'pwd'] 看來是又纔對了
#若是以上全部的方法你都以爲用的不爽的話
req_dict = dict(request.form)
print(req_dict)  # 若是你以爲用字典更爽的話,也能夠轉成字典操做(這裏有坑)

View Code

request.args

3.request.args 之你能看見的Url參數全在裏面

request.args 中保存的是url中傳遞的參數

先把後端請求代碼改動一下，容許POST和GET

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req",methods=["POST","GET"])  # 只容許POST和GET
def home():  # 視圖函數
    print(request.args)  # ImmutableMultiDict([('id', '1'), ('age', '20')])
    print(request.args["id"])  # 1
    print(request.args.get("age"))  # 20
    print(list(request.args.keys()))  # ['id', 'age']
    print(list(request.args.values()))  # ['1', '20']
    req_dict = dict(request.args)  # {'id': ['1'], 'age': ['20']}
    print(req_dict)

    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

而後使用URL地址直接傳遞參數

http://127.0.0.1:5000/req?id=1&age=20

而後會在控制檯中看到，ImmutableMultiDict

ImmutableMultiDict([('id', '1'), ('age', '20')])
20
['id', 'age']
['1', '20']
{'id': ['1'], 'age': ['20']}

request.args 與 request.form 的區別就是:

request.args 是獲取url中的參數

request.form 是獲取form表單中的參數

request.values

4.request.values 之只要是個參數我都要

改動一下前端代碼:

<form action="/req?id=1&age=20" method="post">

完整代碼以下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>歡迎登錄</h1>
<form action="/req?id=1&age=20" method="post">
    <p>
        <input type="text" name="user" placeholder="請輸入用戶名">
    </p>
    <p>
        <input type="password" name="pwd" placeholder="請輸入密碼">
    </p>
    <input type="submit" value="提交">
</form>
</body>
</html>

View Code

改動後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req",methods=["POST","GET"])  # 只容許POST和GET
def home():  # 視圖函數
    print(
        request.values)  # CombinedMultiDict([ImmutableMultiDict([('id', '1'), ('age', '20')]), ImmutableMultiDict([('user', 'xiao'), ('pwd', '123')])])
    print(request.values.get("id"))  # 1
    print(request.values["user"])  # Oldboy
    # 這回喜歡直接操做字典的小夥伴們有驚喜了! to_dict() 方法能夠直接將咱們的參數所有轉爲字典形式
    print(request.values.to_dict())  # {'user': 'xiao', 'pwd': '123', 'id': '1', 'age': '20'}

    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

這是讓咱們在使用form表單提交的同時使用url參數提交

訪問登陸頁面，點擊提交，查看Pycharm控制檯輸出：

CombinedMultiDict([ImmutableMultiDict([('id', '1'), ('age', '20')]), 
ImmutableMultiDict([('user', 'xiao'), ('pwd', '123')])])
1
xiao
{'user': 'xiao', 'pwd': '123', 'id': '1',‘age':’20’}

form表單的坑

注意這裏的坑來啦! 坑來啦!
若是url和form中的Key重名的話,form中的同名的key中value會被url中的value覆蓋
http://127.0.0.1:5000/req?id=1&user=20

修改login.html

<form action="/req?id=1&user=20" method="post">

完整代碼以下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>歡迎登錄</h1>
<form action="/req?id=1&user=20" method="post">
    <p>
        <input type="text" name="user" placeholder="請輸入用戶名">
    </p>
    <p>
        <input type="password" name="pwd" placeholder="請輸入密碼">
    </p>
    <input type="submit" value="提交">
</form>
</body>
</html>

View Code

從新訪問登陸頁面，再次提交。

查看Pycharm控制檯輸出：

CombinedMultiDict([ImmutableMultiDict([('id', '1'), ('user', '20')]), ImmutableMultiDict([('user', 'xiao'), ('pwd', '123')])])
1
20
{'user': '20', 'pwd': '123', 'id': '1'}

View Code

發現user變成了20 ，咦？我明明輸入的是xiao啊

若是url和form中的Key重名的話,form中的同名的key中value會被url中的value覆蓋

request.cookies

5.request.cookies 之存在瀏覽器端的字符串兒也會一塊兒帶過來

前提是你要開啓瀏覽器的 cookies

request.cookies 是將cookies中信息讀取出來

修改demo.py中的home視圖函數

def home():  # 視圖函數
    print(request.cookies)
    return "ok"

從新登陸一次，查看Pycharm控制檯輸出：

{'Hm_lvt_080836300300be57b7f34f4b3e97d911': '1531653977', 'csrftoken': 'nO0pRJxevEVwRpCLzbEpNSAV4GdzO4aXJiE40AHopAkW0xkpzRE7p6gS2BngA4CA'}

request.headers

6.request.headers 之請求頭中的祕密

用來獲取本次請求的請求頭

修改demo.py中的home視圖函數

def home():  # 視圖函數
    print(request.headers)
    return "ok"

從新登陸一次，查看Pycharm控制檯輸出：

Host: 127.0.0.1:5000
Connection: keep-alive
Content-Length: 17
Cache-Control: max-age=0
Origin: http://127.0.0.1:5000
Upgrade-Insecure-Requests: 1
Content-Type: application/x-www-form-urlencoded
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.81 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Referer: http://127.0.0.1:5000/login
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9
Cookie: Hm_lvt_080836300300be57b7f34f4b3e97d911=1531653977; csrftoken=nO0pRJxevEVwRpCLzbEpNSAV4GdzO4aXJiE40AHopAkW0xkpzRE7p6gS2BngA4CA

View Code

request.data

7.request.data 之若是處理不了的就變成字符串兒存在data裏面

你必定要知道 request 是基於 mimetype 進行處理的

mimetype的類型以及字符串兒 : http://www.w3school.com.cn/media/media_mimeref.asp

若是不屬於上述類型的描述,request就會將沒法處理的參數轉爲Json存入到 data 中

其實咱們能夠將 request.data , json.loads 一樣能夠拿到裏面的參數

修改demo.py中的home視圖函數

def home():  # 視圖函數
    print(request.data)
    return "ok"

從新登陸一次，查看Pycharm控制檯輸出：

b''

爲何是空的呢？注意：request處理不了的就變成字符串兒存在data裏面！

由於它能處理，因此纔是空的！

request.files

8.request.files 之給我一個文件我幫你保管

若是遇到文件上傳的話,request.files 裏面存的是你上傳的文件,可是 Flask 在這個文件的操做中加了必定的封裝,讓操做變得極爲簡單

首先改下前端代碼：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h4>歡迎登錄</h4>
<form action="/req" method="post" enctype="multipart/form-data">
    <p>
        <input type="file" name="file">
    </p>
    <input type="submit" value="提交">
</form>
</body>
</html>

View Code

再改後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req",methods=["POST","GET"])  # 只容許POST和GET
def home():  # 視圖函數
    print(request.files)  # ImmutableMultiDict([('file', <FileStorage: 'abc.txt' ('text/plain')>)])
    print(request.files["file"])  # <FileStorage: 'abc.txt' ('text/plain')>
    my_file = request.files["file"]
    my_file.save("123.txt")  # 保存文件,裏面能夠寫完整路徑+文件名

    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

訪問登陸頁面

上傳一個文件，好比是abc.txt

點擊提交，效果以下：

查看Pycharm控制檯輸出：

ImmutableMultiDict([('file', <FileStorage: 'abc.txt' ('text/plain')>)])
<FileStorage: 'abc.txt' ('text/plain')>

這樣咱們就成功的保存了一個名叫 "123.txt" 的文件了,操做仍是很簡單的。保存目錄爲當前py文件目錄！

注意：前端頁面必須設置enctype="multipart/form-data"，不然提交時，會報錯

request.獲取各類路徑

9. request.獲取各類路徑之這些方法不必記,可是要知道它存在

修改後端代碼

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req",methods=["POST","GET"])  # 只容許POST和GET
def home():  # 視圖函數
    # 獲取當前的url路徑
    print(request.path)  # /req
    # 當前url路徑的上一級路徑
    print(request.script_root)  #
    # 當前url的所有路徑
    print(request.url)  # http://127.0.0.1:5000/req
    # 當前url的路徑的上一級所有路徑
    print(request.url_root)  # http://127.0.0.1:5000/

    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

直接訪問頁面

查看Pycharm控制檯輸出：

/req

http://127.0.0.1:5000/req
http://127.0.0.1:5000/

request.json

10. request.json 之前提你得告訴是json

若是在請求中寫入了 "application/json" 使用 request.json 則返回json解析數據, 不然返回 None

修改後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/req",methods=["POST","GET"])  # 只容許POST和GET
def home():  # 視圖函數
    # 獲取json數據
    print(request.json )

    return "ok"


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

使用postman發送一個json數據

查看返回值

查看Pycharm控制檯輸出：

{'id': 1}

本文參考連接：

http://www.javashuo.com/article/p-buqnvyzr-bq.html

4、模板語言 Jinja2

Jinja2

是時候開始寫個前端了,Flask中默認的模板語言是Jinja2

如今咱們來一步一步的學習一下 Jinja2 捎帶手把 render_template 中留下的疑問解決一下

首先咱們要在後端定義幾個字符串,用於傳遞到前端

STUDENT = {'name': '韓雪', 'age': 24, 'gender': '女'}

STUDENT_LIST = [
    {'name': '韓雪', 'age': 24, 'gender': '女'},
    {'name': '舒暢', 'age': 23, 'gender': '女'},
    {'name': '唐嫣', 'age': 25, 'gender': '女'}
]

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

可是前提咱們要知道Jinja2模板中的流程控制:

for

Jinja2模板語言中的 for

{% for foo in g %}
{{ foo }}
{% endfor %}

if

Jinja2模板語言中的 if

{% if g %}

{% elif g %}
    
{% else %}
    
{% endif %}

接下來,咱們對這幾種狀況分別進行傳遞,並在前端顯示成表格

字典

1. 使用STUDENT字典傳遞至前端

後端demo.py

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

STUDENT = {'name': '韓雪', 'age': 24, 'gender': '女'}

STUDENT_LIST = [
    {'name': '韓雪', 'age': 24, 'gender': '女'},
    {'name': '舒暢', 'age': 23, 'gender': '女'},
    {'name': '唐嫣', 'age': 25, 'gender': '女'}
]

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

@app.route("/student")
def student():
    return render_template("student.html", student=STUDENT)


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

前端student.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>學生列表</h3>
<div>{{ student }}</div>
<table border="1px">
    <tr>
        <td>{{ student.name }}</td>
        <td>{{ student["age"] }}</td>
        <td>{{ student.get("gender") }}</td>
    </tr>
</table>
</body>
</html>

View Code

從新flask，訪問頁面

從這個例子中,能夠看出來,字典傳入前端Jinja2 模板語言中的取值操做, 與Python中的Dict操做極爲類似,而且多了一個student.name的對象操做

列表

2. STUDENT_LIST 列表傳入前端Jinja2 模板的操做:

後端：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

STUDENT = {'name': '韓雪', 'age': 24, 'gender': '女'}

STUDENT_LIST = [
    {'name': '韓雪', 'age': 24, 'gender': '女'},
    {'name': '舒暢', 'age': 23, 'gender': '女'},
    {'name': '唐嫣', 'age': 25, 'gender': '女'}
]

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

@app.route("/student_list")
def student_list():
    return render_template("student.html", student=STUDENT_LIST)


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

前端：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>學生列表</h3>
<div>{{ student }}</div>
<table border="1px">
    {% for foo in student %}
        <tr>
            <td>{{ foo }}</td>
            <td>{{ foo.name }}</td>
            <td>{{ foo.get("age") }}</td>
            <td>{{ foo["gender"] }}</td>
        </tr>
    {% endfor %}
</table>
</body>
</html>

View Code

訪問頁面，注意：路徑改了，效果以下：

這裏咱們能夠看出，若是是須要循環遍歷的話,Jinja2 給咱們的方案是

{% for foo in student %}
    <tr>
        <td>{{ foo }}</td>
    </tr>
{% endfor %}

修改前端：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>學生列表</h3>
<div>{{ student }}</div>
<table border="1px">
    {% for foo in student %}
        <tr>
            <td>{{ foo }}</td>
        </tr>
    {% endfor %}
</table>
</body>
</html>

View Code

訪問頁面，注意：路徑改了，效果以下：

大字典

3.STUDENT_DICT 大字典傳入前端 Jinja2 模板

後端：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

STUDENT = {'name': '韓雪', 'age': 24, 'gender': '女'}

STUDENT_LIST = [
    {'name': '韓雪', 'age': 24, 'gender': '女'},
    {'name': '舒暢', 'age': 23, 'gender': '女'},
    {'name': '唐嫣', 'age': 25, 'gender': '女'}
]

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

@app.route("/student_dict")
def student_dict():
    return render_template("student.html", student=STUDENT_DICT)


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

前端：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>學生列表</h3>
<div>{{ student }}</div>
<table border="1px">
    {% for foo in student %}
        <tr>
            <td>{{ foo }}</td>
            <td>{{ student.get(foo).name }}</td>
            <td>{{ student[foo].get("age") }}</td>
            <td>{{ student[foo]["gender"] }}</td>
        </tr>
    {% endfor %}
</table>
</body>
</html>

View Code

在遍歷字典的時候,foo 實際上是至關於拿出了字典中的Key

訪問頁面，注意：路徑改了，效果以下：

數據集合

4.結合全部的字符串兒所有專遞前端Jinja2 模板

後端：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

STUDENT = {'name': '韓雪', 'age': 24, 'gender': '女'}

STUDENT_LIST = [
    {'name': '韓雪', 'age': 24, 'gender': '女'},
    {'name': '舒暢', 'age': 23, 'gender': '女'},
    {'name': '唐嫣', 'age': 25, 'gender': '女'}
]

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

@app.route("/allstudent")
def allstudent():
    return render_template("student.html", student=STUDENT,
                           student_list=STUDENT_LIST,
                           student_dict=STUDENT_DICT)


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

前端：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h3>學生列表</h3>
<div> _____________________________________</div>
Welcome to : student
<div>{{ student }}</div>
<table border="1px">
    <tr>
        <td>{{ student.name }}</td>
        <td>{{ student["age"] }}</td>
        <td>{{ student.get("gender") }}</td>
    </tr>
</table>
<div> _____________________________________</div>
Welcome to : student_list
<div>{{ student_list }}</div>
<table border="1xp">
    {% for foo in student_list %}
        <tr>
            <td>{{ foo }}</td>
            <td>{{ foo.name }}</td>
            <td>{{ foo.get("age") }}</td>
            <td>{{ foo["gender"] }}</td>
        </tr>
    {% endfor %}
</table>
<div> _____________________________________</div>
Welcome to : student_dict
<div>{{ student_dict }}</div>
<table border="1xp">
    {% for foo in student_dict %}
        <tr>
            <td>{{ foo }}</td>
            <td>{{ student_dict.get(foo).name }}</td>
            <td>{{ student_dict[foo].get("age") }}</td>
            <td>{{ student_dict[foo]["gender"] }}</td>
        </tr>
    {% endfor %}
</table>
</body>
</html>

View Code

訪問頁面，注意：路徑改了，效果以下：

這裏能夠看出來,render_template中能夠傳遞多個關鍵字

**{}字典

5.利用 **{}字典的方式傳遞參數

前端不變(標題4的前端代碼)

後端：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request  # 導入flask中的request

app = Flask(__name__)

STUDENT = {'name': '韓雪', 'age': 24, 'gender': '女'}

STUDENT_LIST = [
    {'name': '韓雪', 'age': 24, 'gender': '女'},
    {'name': '舒暢', 'age': 23, 'gender': '女'},
    {'name': '唐嫣', 'age': 25, 'gender': '女'}
]

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

@app.route("/allstudent")
def allstudent():
    return render_template("student.html", **{"student": STUDENT,
                                                  "student_list": STUDENT_LIST,
                                                  "student_dict": STUDENT_DICT})


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

刷新頁面，效果同上！

Jinja2 的高階用法

Jinja2 模板語言爲咱們提供了不少功能接下來看一下它有什麼高級的用法

safe

6.1. safe : 此時你與HTML只差一個 safe

後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template

app = Flask(__name__)

@app.route("/")
def index():
    tag = "<input type='text' name='user' value='xiao'>"
    return render_template("index.html",tag=tag)

if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

在templates目錄下新建文件index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    {{ tag }}

</body>
</html>

View Code

訪問首頁，效果以下：

彷佛和咱們想要結果不太同樣,有兩種解決方案,

第一種,從前端入手

前端代碼：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    {{ tag|safe }}

</body>
</html>

View Code

刷新頁面，效果以下：

還有一種方式是從後端入手

後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import Markup  # 導入 flask 中的 Markup 模塊

app = Flask(__name__)

@app.route("/")
def index():
    tag = "<input type='text' name='user' value='xiao'>"
    # Markup幫助我們在HTML的標籤上作了一層封裝,讓Jinja2模板語言知道這是一個安全的HTML標籤
    markup_tag = Markup(tag)
    # <input type='text' name='user' value='DragonFire'> <class 'markupsafe.Markup'>
    print(markup_tag,type(markup_tag))

    return render_template("index.html", tag=markup_tag)

if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

修改前端，還原代碼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    {{ tag }}

</body>
</html>

View Code

刷新頁面，效果同上！

執行Python函數

模板中執行函數，首先在文件中定義一個函數

後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template

app = Flask(__name__)

#定義一個函數,把它傳遞給前端
def a_b_sum(a,b):
    return a+b

@app.route("/")
def index():
    return render_template("index.html", tag=a_b_sum)

if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

前端代碼：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    {{ tag }}
    <br>
    {#傳入2個參數#}
    {{ tag(99,1) }}

</body>
</html>

View Code

刷新頁面，效果以下：

看到結果就是,函數加()執行獲得結果

還能夠定義全局函數,無需後端傳遞給前端,Jinja2直接就能夠執行的函數

後端代碼：

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template

app = Flask(__name__)

@app.template_global()  # 定義全局模板函數
def a_b_sum(a, b):
    return a + b


@app.template_filter()  # 定義全局模板函數
def a_b_c_sum(a, b, c):
    return a + b + c


@app.route("/")
def index():
    return render_template("index.html", tag="")

if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

前端代碼：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    {#函數#}
    {{ a_b_sum(99,1) }}
    <br>
    {#過濾器#}
    {{ 1 | a_b_c_sum(197,2) }}

</body>
</html>

View Code

兩個函數的調用方式不太同樣

尤爲是@app.template_filter() 它的調用方式比較特別,這是兩個Flask中的特殊裝飾器

刷新頁面，效果以下：

模板複用 block

若是咱們前端頁面有大量重複頁面,不必每次都寫,可使用模板複用的方式複用模板

前端代碼：

index.html 文件中的內容

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <h1>Welcome to My</h1>
    <h2>下面的內容是不同的</h2>
    {% block content %}

    {% endblock %}
    <h2>上面的內容是不同的,可是下面的內容是同樣的</h2>
    <h1>My is Good</h1>

</body>
</html>

View Code

{% extends "index.html" %}
{% block content %}
    <h4>歡迎登錄</h4>
    <form>
        用戶名:<input type="text" name="user">
        密碼:<input type="text" name="pwd">
        <input type="submit" value="提交">
    </form>
{% endblock %}

View Code

home.html 文件中的內容

{% extends "index.html" %}
{% block content %}
    <h1>歡迎來到py3study.com</h1>
{% endblock %}

View Code

後端demo.py代碼:

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template

app = Flask(__name__)

@app.route("/login")
def login():
    return render_template("login.html")


@app.route("/home")
def home():
    return render_template("home.html")

if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

重啓flask，訪問登陸頁面：

查看home頁面

大概是這樣一個效果

在這兩個頁面中,只有 block 中的內容發生了變化,其餘的位置徹底同樣

引用 include

6.4 Jinja2模板語言的模塊引用 include

<h4>歡迎登錄</h4>
<form>
    用戶名:<input type="text" name="user">
    密碼:<input type="text" name="pwd">
    <input type="submit" value="提交">
</form>

View Code

index.html 文件中的內容

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

    <h1>Welcome to My</h1>

    {% include "login.html" %}
    <h2>上面的內容是不同的,可是下面的內容是同樣的</h2>

    <h1>My is Good</h1>

</body>
</html>

View Code

後端demo.py代碼:

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template

app = Flask(__name__)

@app.route("/")
def index():
    return render_template("index.html")


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

重啓flask，訪問頁面：

這就是將 login.html 當成一個模塊,加載到 index.html 頁面中

5、用戶登陸例子

作一個用戶登陸以後查看學員信息的小例子

需求:

1. 用戶名: xiao 密碼: 123
2. 用戶登陸成功以後跳轉到列表頁面
3. 失敗有消息提示,從新登陸
4.點擊學生名稱以後,能夠看到學生的詳細信息

後端

demo.py

from flask import Flask  # 導入Flask類
from flask import render_template  # 導入flask中的render_template
from flask import request
from flask import redirect

app = Flask(__name__)


USER = {'username': 'xiao', 'password': "123"}

STUDENT_DICT = {
    1: {'name': '韓雪', 'age': 24, 'gender': '女'},
    2: {'name': '舒暢', 'age': 23, 'gender': '女'},
    3: {'name': '唐嫣', 'age': 25, 'gender': '女'},
}

app = Flask(__name__)

# 只容許GET和POST請求
@app.route("/login", methods=["GET", "POST"])
def login():
    if request.method == "POST":
        if request.form["username"] == USER["username"] and request.form["password"] == USER["password"]:
            return redirect("/student_list")
        return render_template("login.html", msg="用戶名密碼錯誤")

    return render_template("login.html", msg="")  # 若是前端Jinja2模板中使用了msg,這裏就算是傳遞""也要出現msg


@app.route("/student_list")
def student():  # 學生列表
    return render_template("student_list.html", student=STUDENT_DICT)


@app.route("/info")
def student_info():  # 學生的詳細信息
    # 獲取id
    stu_id = int(request.args["id"])
    stu_info = STUDENT_DICT[stu_id]
    return render_template("student.html", student=stu_info, stu_id=stu_id)


if __name__ == '__main__':
    app.run("0.0.0.0", 5000, debug=True)

View Code

前端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <form method="post">
        用戶名:<input type="text" name="username">
        密碼:<input type="text" name="password">
        <input type="submit" value="登陸">
        {{ msg }}
    </form>
</body>
</html>

View Code

student_list.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table border="2xp">
    <thead>
        <tr>
            <td>id</td>
            <td>name</td>
            <td>option</td>
        </tr>
    </thead>
    <tbody>
        {% for foo in student %}
            <tr>
                <td>{{ foo }}</td>
                <td>{{ student[foo].name }}</td>
                <td><a href="/info?id={{ foo }}">詳細</a></td>
            </tr>
        {% endfor %}
    </tbody>
</table>
</body>
</html>

View Code

student.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table border="1px">
    <thead>
    <tr>
        <td>id</td>
        <td>name</td>
        <td>age</td>
        <td>gender</td>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>{{ stu_id }}</td>
        <td>{{ student.name }}</td>
        <td>{{ student["age"] }}</td>
        <td>{{ student.get("gender") }}</td>
    </tr>
    </tbody>
</table>
<div><a href="/student_list">返回</a></div>
</body>
</html>

View Code

重啓flask，訪問登陸頁面

登陸以後，跳轉到學生列表頁面

點擊詳細

思考題:

1.若是我直接訪問 /student_list 和 /student 是否是也能夠?

2.怎麼才能在全部的url地址中校驗是否登陸?

本文參考連接：

http://www.javashuo.com/article/p-oqemdnqe-bw.html

6、內置Sessio

Flask中的Session很是的奇怪,他會將你的SessionID存放在客戶端的Cookie中,使用起來也很是的奇怪

secret_key

1. Flask 中 session 是須要 secret_key 的

from flask import session
app = Flask(__name__)
app.secret_key = "ask"

secret_key 其實是用來加密字符串的,若是在實例化的app中沒有 secret_key 那麼開啓session必定會拋異常的

使用session

2. session 要這樣用

@app.route("/login", methods=["GET", "POST"])
def login():
    if request.method == "POST":
        if request.form["username"] == USER["username"] and request.form["password"] == USER["password"]:
            session["user"] = USER["username"]
            return redirect("/student_list")
        return render_template("login.html", msg="用戶名密碼錯誤")

    return render_template("login.html", msg="")  # 若是前端Jinja2模板中使用了msg,這裏就算是傳遞""也要出現msg

session["user"] = USER["username"] 這樣用就表明這個請求帶上來的session中保存了一個user=name
若是想要驗證session的話,就用這種方法吧

cookies 中的 session 是什麼

3. cookies 中的 session 是什麼

cookies 中 session 存儲的是經過 secret_key 加密後的 key , 經過這個 key 從flask程序的內存中找到用戶對應的session信息

session 驗證

4. 怎麼用 session 進行驗證呢?

@app.route("/student_list")
def student():
    if session.get("user"):
        return render_template("student_list.html", student=STUDENT_DICT)

    return redirect("/login")

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。