Flask 上傳自定義頭像的實(shí)例詳解
Flask Web 開發(fā)這本書基本上做完了,后面還需要溫習(xí),但是自己做的博客總覺得簡(jiǎn)陋了點(diǎn),所以,在動(dòng)腦子開發(fā)新功能
今天想到最基本的功能,自定義頭像
那這樣的功能,設(shè)計(jì)到2大基本功能塊
1:如何進(jìn)行文件的上傳和保存
2:如何在用戶模型里面將頭像照片和用戶掛鉤起來
第二個(gè)問題我在查閱了網(wǎng)上的討論后,得出基本上2種方法,
第一種是將圖片變成二進(jìn)制以后存入數(shù)據(jù)庫(kù)
第二種是將圖片直接存放于文件系統(tǒng)中
先研究如何上傳文件成功這個(gè)事情
從最簡(jiǎn)單的開始
在main的views文件內(nèi),添加以下準(zhǔn)備工作
import os from flask import Flask, request, redirect, url_for UPLOAD_FOLDER=r'E:\flasky\app\upload'
設(shè)置UPLOAD_FOLDER的路徑,表示文件最終要存在哪一個(gè)位置
@main.route('/upload_file',methods = ['GET','POST']) def upload_file(): #... if request.method == 'POST': file = request.files['file'] file.save(os.path.join(UPLOAD_FOLDER,file.filename)) return '<p>success</p>' return ''' <!DOCTYPE html> <title>Change new icon</title> <h1>Upload new </h1> <form action = "" method = "post" enctype=multipart/form-data> <input type = "file" name = file> <input type = "submit" value = Upload> </form> '''
然后為上傳文件功能單獨(dú)做一個(gè)路由,是專門用一個(gè)頁(yè)面來提供上傳文件
file=request.files['file']表示,從request請(qǐng)求的files字典中,取出file對(duì)應(yīng)的文件。這個(gè)文件是一個(gè)FileStorage對(duì)象,這個(gè)我們后面再講
這個(gè)文件對(duì)象擁有一個(gè)函數(shù)功能來保存文件,叫做save()
這個(gè)文件對(duì)象還擁有一個(gè)屬性來提取文件名,叫做filename
他的參數(shù)就是路徑名稱
如上面代碼,我用了os.path.join拼接的方法來做出保存路徑名
至于提交保存以后的返回頁(yè)面,我先簡(jiǎn)單做了一個(gè) 顯示 success的頁(yè)面表示功能成功
而整個(gè)頁(yè)面的渲染,直接在return里面寫入了這個(gè)表單,我們來看看功能
PS: 在用戶資料頁(yè)面,我已經(jīng)加入了按鈕來通向更改頭像的頁(yè)面,這個(gè)就不多說了
好,最重要的一環(huán)節(jié)上傳文件已經(jīng)完成了,接下來的工作就是對(duì)代碼的完善了
比如,添加指定允許文件類型的范圍
ALLOWED_EXTENSIONS=set(['txt','pdf','png','jpg','jpeg','gif'])
于是乎,代碼變成了
UPLOAD_FOLDER=r'E:\flasky\app\upload' ALLOWED_EXTENSIONS=set(['txt','pdf','png','jpg','jpeg','gif']) def allowed_file(filename): return '.' in filename and filename.rsplit('.',1)[1] in ALLOWED_EXTENSIONS @main.route('/upload_file',methods = ['GET','POST']) def upload_file(): if request.method == 'POST': file = request.files['file'] if file and allowed_file(file.filename): file.save(os.path.join(UPLOAD_FOLDER,file.filename)) return '<p>success</p>' return '<p> 你上傳了不允許的文件類型 </p>' return ''' <!DOCTYPE html> <title>Change new icon</title> <h1>Upload new </h1> <form action = "" method = "post" enctype=multipart/form-data> <input type = "file" name = file> <input type = "submit" value = Upload> </form> '''
好,講到這里,就要回過頭來看看Flask官方文檔的說明了
首先第一點(diǎn),request的files屬性
所以說,非常方便,可以通過file.filename ,直接獲取文件的名字
另外,這個(gè)文件對(duì)象,可以直接用save功能儲(chǔ)存,2可以有2個(gè)參數(shù),一個(gè)是dst表示存放路徑,第二個(gè)是緩存尺寸,表示在存儲(chǔ)過程中的大小,默認(rèn)16kb。
我們來看下效果,我們用MP3后綴名的文件來進(jìn)行測(cè)試
我在檢測(cè)到是不允許的文件類型時(shí),返回寫了一句提示
接著,我們要再講一個(gè)功能 secure_filename(),他是防止用于起一些可以影響到系統(tǒng)運(yùn)行的文件名,來擾亂你的網(wǎng)站
比如如官方文檔所說的
再來看下這個(gè)函數(shù)的功能,其實(shí)他為了保證文件名不會(huì)影響到系統(tǒng),他就把文件名里面的斜杠和空格,替換成了下劃線
這樣,就保證了文件只會(huì)在當(dāng)前目錄使用,而不會(huì)由于路徑問題被利用去做其他事情。
所以,在儲(chǔ)存文件之前,通過這個(gè)函數(shù)把文件名先修改一下
@main.route('/upload_file',methods = ['GET','POST']) def upload_file(): if request.method == 'POST': file = request.files['file'] if file and allowed_file(file.filename): filename = secure_filename(file.filename) file.save(os.path.join(UPLOAD_FOLDER,filename)) return '<p>success</p>' return '<p> 你上傳了不允許的文件類型 </p>' return ''' <!DOCTYPE html> <title>Change new icon</title> <h1>Upload new </h1> <form action = "" method = "post" enctype=multipart/form-data> <input type = "file" name = file> <input type = "submit" value = Upload> </form> '''
我們?cè)賮頊y(cè)試下功能
最后,還有一個(gè)功能,就是立即查看已經(jīng)剛剛上傳的文件
我這里創(chuàng)建了一個(gè)jpg圖像文件
這里需要用到的函數(shù)是send_from_directory
我們將上傳的代碼再次修改一下,變成上傳完以后立刻預(yù)覽
UPLOAD_FOLDER=r'E:\flasky\app\upload' ALLOWED_EXTENSIONS=set(['txt','pdf','png','jpg','jpeg','gif']) def allowed_file(filename): return '.' in filename and filename.rsplit('.',1)[1] in ALLOWED_EXTENSIONS @main.route('/upload_file',methods = ['GET','POST']) def upload_file(): if request.method == 'POST': file = request.files['file'] if file and allowed_file(file.filename): filename = secure_filename(file.filename) file.save(os.path.join(UPLOAD_FOLDER,filename)) return redirect(url_for('.uploaded_file',filename=filename)) #跳轉(zhuǎn)到預(yù)覽頁(yè)面 return '<p> 你上傳了不允許的文件類型 </p>' return ''' <!DOCTYPE html> <title>Change new icon</title> <h1>Upload new </h1> <form action = "" method = "post" enctype=multipart/form-data> <input type = "file" name = file> <input type = "submit" value = Upload> </form> ''' @main.route('/uploaded_file/<filename>') def uploaded_file(filename): return send_from_directory(UPLOAD_FOLDER,filename)
我創(chuàng)建了一張t.jpg的圖片,里面用文本框?qū)懥艘痪湓挘簿褪窍旅骖A(yù)覽里面看到的
到這里為止,基本的上傳和預(yù)覽功能就實(shí)現(xiàn)了,后面還要再和用戶頭像掛鉤,還得再動(dòng)動(dòng)腦子。
以上這篇Flask 上傳自定義頭像的實(shí)例詳解就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
numpy:np.newaxis 實(shí)現(xiàn)將行向量轉(zhuǎn)換成列向量
今天小編就為大家分享一篇numpy:np.newaxis 實(shí)現(xiàn)將行向量轉(zhuǎn)換成列向量,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-11-11Python變量類型知識(shí)點(diǎn)總結(jié)
在本文里我們給大家分析一篇關(guān)于Python變量類型的相關(guān)知識(shí)點(diǎn)內(nèi)容,需要的朋友們跟著學(xué)習(xí)下。2019-02-02Python使用urllib2模塊抓取HTML頁(yè)面資源的實(shí)例分享
這篇文章主要介紹了Python使用urllib2模塊抓取HTML頁(yè)面資源的實(shí)例分享,將要抓取的頁(yè)面地址寫在單獨(dú)的規(guī)則列表中方便組織和重復(fù)使用,需要的朋友可以參考下2016-05-05python 實(shí)現(xiàn)提取PPT中所有的文字
這篇文章主要介紹了python 實(shí)現(xiàn)提取PPT中所有的文字,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2021-03-03