Flask框架從入門到精通之Request（六）

〆 小源。發表於2019-04-30
Flask框架

知識點： 1、HttpRequest 2、常用請求方式 3、上傳圖片

一、概況

我們都知道當瀏覽器去訪問一個地址時，Http協議會像後臺傳遞一個request物件。這個request物件包含了請求頭、請求引數、以及請求方式，當然後臺可以取到request。然後進行邏輯處理。

在這裡插入圖片描述
在flask中，request物件是一個全域性的，在任何地方都可以使用。

二、GET請求

我們寫一個接受個人資訊的介面，也就是檢視函式。我們新建一個名為register.html的模板，在模板裡寫如下表單：

  • action：表示要提交到的地址
  • method：請求方式
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<form action="/center/add" method="get">
    使用者名稱：<input type="text" name="name"><br>
    年齡：<input type="text" name="age"><br>
    愛好：吃<input type="checkbox" name="hobby" value="吃">
    喝<input type="checkbox" name="hobby" value="喝">
    玩<input type="checkbox" name="hobby" value="玩">
    樂<input type="checkbox" name="hobby" value="樂"><br>

    <input type="submit" value="提交">

</form>

</body>
</html>
複製程式碼

後臺這個時候需要寫兩個檢視，一個檢視用於顯示註冊頁面，一個檢視用於處理前端傳過來的引數：

from flask import Flask, request, render_template

app = Flask(__name__)


@app.route('/')  # 代表首頁
def index():  # 檢視函式
    return render_template('register.html')


@app.route('/center/add')  # 代表個人中心頁
def center():  # 檢視函式
    if request.method == 'GET':  # 請求方式是get
        name = request.args.get('name')  # args取get方式引數
        age = request.args.get('age')
        hobby = request.args.getlist('hobby')  # getlist取一鍵多值型別的引數
        return "姓名：%s 年齡：%s 愛好：%s" % (name, age, hobby)


app.config['DEBUG'] = True

if __name__ == '__main__':
    # 0.0.0.0代表任何能代表這臺機器的地址都可以訪問
    app.run(host='0.0.0.0', port=5000)  # 執行程式

複製程式碼

我們在瀏覽器訪問一下：

在這裡插入圖片描述
當我們點選提交後：
在這裡插入圖片描述
可以看到我們後後已經接到前端引數，並展示到瀏覽器上了。

三、POST請求

登入和註冊都會使用Post請求，誰也不希望自己的一些敏感資訊在瀏覽器的地址上顯示。那我們把剛才的列子剛改Post請求，齊前端只需要把表單裡面的method改下就行：

method="post"
複製程式碼

後臺需要改的地方有兩個地方：

  • 請求方法：預設是get請求
  • 引數提前：把args改成form
from flask import Flask, request, render_template

app = Flask(__name__)


@app.route('/')  # 代表首頁
def index():  # 檢視函式
    return render_template('register.html')


@app.route('/center/add', methods=['GET', 'POST'])  # 支援get、post請求
def center():  # 檢視函式
    if request.method == 'GET':  # 請求方式是get
        name = request.args.get('name')  # args取get方式引數
        age = request.args.get('age')
        hobby = request.args.getlist('hobby')  # getlist取一鍵多值型別的引數
        return "姓名：%s 年齡：%s 愛好：%s" % (name, age, hobby)
    elif request.method == 'POST':
        name = request.form.get('name')  # form取post方式引數
        age = request.form.get('age')
        hobby = request.form.getlist('hobby')  # getlist取一鍵多值型別的引數
        return "姓名：%s 年齡：%s 愛好：%s" % (name, age, hobby)


app.config['DEBUG'] = True

if __name__ == '__main__':
    # 0.0.0.0代表任何能代表這臺機器的地址都可以訪問
    app.run(host='0.0.0.0', port=5000)  # 執行程式

複製程式碼

當我們點選提交後：

在這裡插入圖片描述
可以看到我們後臺已經接到前端引數，並展示到瀏覽器上了。並且我們傳遞的引數不在瀏覽器地址上拼接了，這樣做的好處可以隱藏引數。

如果是Pos方式t我們完全可以把檢視函式合成一個：

  • 前端：form表單可以不寫action，代表要提交當前地址上
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<form method="post">
    使用者名稱：<input type="text" name="name"><br>
    年齡：<input type="text" name="age"><br>
    愛好：吃<input type="checkbox" name="hobby" value="吃">
    喝<input type="checkbox" name="hobby" value="喝">
    玩<input type="checkbox" name="hobby" value="玩">
    樂<input type="checkbox" name="hobby" value="樂"><br>

    <input type="submit" value="提交">

</form>

</body>
</html>
複製程式碼
  • 後端：根據請求方式處理不同操作
from flask import Flask, request, render_template

app = Flask(__name__)


@app.route('/register', methods=['GET', 'POST'])  # 支援get、post請求
def register():  # 檢視函式
    if request.method == 'GET':  # 請求方式是get
        return render_template('register.html')  # 返回模板
    elif request.method == 'POST':
        name = request.form.get('name')  # form取post方式引數
        age = request.form.get('age')
        hobby = request.form.getlist('hobby')  # getlist取一鍵多值型別的引數
        return "姓名：%s 年齡：%s 愛好：%s" % (name, age, hobby)


app.config['DEBUG'] = True

if __name__ == '__main__':
    # 0.0.0.0代表任何能代表這臺機器的地址都可以訪問
    app.run(host='0.0.0.0', port=5000)  # 執行程式

複製程式碼

我們訪問瀏覽器地址為：http://0.0.0.0:5000/register

四、上傳檔案

上傳檔案也是我們經常用到的功能，前端上傳一張檔案，然後後端處理儲存到伺服器上。 檔案這種型別屬於多媒體型別資源。前端form表單裡面需要加enctype="multipart/form-data"。我們新建一個名upload.html模板 模板裡面寫如下程式碼：

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

<form action="" method="post" enctype="multipart/form-data">
    <input type="file" name="file">
    <input type="submit" value="上">
</form>

</body>
</html>
複製程式碼

我們重新新建一個upload.py檔案，並在此檔案的目錄建立一個名media的資料夾，用來放我們上傳的圖片：

在這裡插入圖片描述
upload.py檔案裡面程式碼如下：

from flask import Flask, request, render_template, redirect, url_for
from werkzeug.utils import secure_filename
import os
from flask import send_from_directory

app = Flask(__name__)

UPLOAD_FOLDER = 'media'
ALLOWED_EXTENSIONS = set(['txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'])
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER


# 判斷上傳的檔案是否是允許的字尾
def allowed_file(filename):
    return "." in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS


@app.route("/upload", methods=['GET', 'POST'])
def upload():
    if request.method == 'GET':  # 請求方式是get
        return render_template('upload.html')  # 返回模板
    else:
        if "file" not in request.files:
            return redirect(request.url)

        file = request.files.get('file')  # 獲取檔案

        if file.filename == '':
            return redirect(request.url)

        if file and allowed_file(file.filename):
            filename = secure_filename(file.filename)  # 用這個函式確定檔名稱是否是安全 （注意：中文不能識別）
            file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))  # 儲存檔案
            return redirect(url_for('show',
                                    filename=filename))


# 展示圖片
@app.route('/show/<filename>')
def show(filename):
    # send_from_directory可以從目錄載入檔案
    return send_from_directory(app.config['UPLOAD_FOLDER'],
                               filename)


if __name__ == '__main__':
    # 0.0.0.0代表任何能代表這臺機器的地址都可以訪問
    app.run(host='0.0.0.0', port=5000, debug=True)  # 執行程式


複製程式碼

我們在瀏覽器訪問一下：

在這裡插入圖片描述

選擇一張電腦上的圖片，然後點選上傳:

image
並且也可以看到前端上傳的圖片已經儲存到我們的media資料夾下。 歡迎關注我的公眾號：

image

相關文章