flask dropzone文件上传模块(flask 70)

2019-08-21 16:53:38 浏览数 (1)

flask-Dropzone

代码语言:javascript复制
初始化:
 from flask_dropzone import Dropzone
 app = Flask(name)
 dropzone = Dropzone(app)

or

代码语言:javascript复制
from flask_dropzone import Dropzone
 dropzone = Dropzone()
 def create_app():
 app = Flask(name)
 dropzone.init_app(app)
 return app

页面中引入JS

代码语言:javascript复制
<head>
 ...
 {{ dropzone.load_css() }}
 </head>
 <body>
 ...
 {{ dropzone.load_js() }}
 </body>

页面中渲染

代码语言:javascript复制
<head>
 {{ dropzone.style('border: 2px dashed #0087F7; margin: 10%') }}
 </head>
 {{ dropzone.create(action='处理上传文件的路由URL') }}

服务端处理

import os

from flask import Flask, request from flask_dropzone import Dropzone

app = Flask(name)

dropzone = Dropzone(app)

@app.route('/uploads', methods=['GET', 'POST']) def upload():

代码语言:javascript复制
if request.method == 'POST':  # 如果请求类型为POST,说明是文件上传请求
    f = request.files.get('file')  # 获取文件对象
    f.save(os.path.join('the/path/to/save', f.filename))  # 保存文件

return 'upload template'  # 渲染上传页面

上传文件后,设置重定向:

DROPZONE_REDIRECT_VIEW

服务端自己做验证

代码语言:javascript复制
@app.route('/', methods=['POST', 'GET'])
 def upload():
 if request.method == 'POST':
 f = request.files.get('file')
 if f.filename.split('.')[1] != 'png':
 return 'PNG only!', 400  # return the error message, with a proper 4XX code
 f.save(os.path.join('the/path/to/save', f.filename))
 return render_template('index.html')

完整的配置列表:

DROPZONE_SERVE_LOCAL 是否使用内置的本地资源 DROPZONE_MAX_FILE_SIZE 允许文件最大值,单位MB DROPZONE_INPUT_NAME 上传字段 DROPZONE_ALLOWED_FILE_CUSTOM False 是否使用自定义文件类型允许规则 DROPZONE_ALLOWED_FILE_TYPE 'default' 允许的文件类型 DROPZONE_MAX_FILES ‘null’ 一次可以上传的文件数量最大值 DROPZONE_DEFAULT_MESSAGE “Drop files here to upload” 上传区域显示的提示文字 DROPZONE_INVALID_FILE_TYPE “You can’t upload files of this type.” 文件类型错误的错误消息 DROPZONE_FILE_TOO_BIG “File is too big {{filesize}}. Max filesize: {{maxFilesize}}MiB.” 文件太大时显示的错误消息 DROPZONE_SERVER_ERROR “Server error: {{statusCode}}” 服务器错误的错误消息 DROPZONE_BROWSER_UNSUPPORTED “Your browser does not support drag’n’drop file uploads.” 浏览器不支持的错误消息 DROPZONE_MAX_FILE_EXCEED “Your can’t upload any more files.” 超过最大文件数量限制的错误消息 ROPZONE_UPLOAD_MULTIPLE False 是否在单个请求中发送多个文件,默认一个请求发送一个文件 DROPZONE_PARALLEL_UPLOADS 2 当DROPZONE_UPLOAD_MULTIPLE设为True时,设置单个请求包含的文件数量 DROPZONE_REDIRECT_VIEW None 上传完成后重定向的模板端点 DROPZONE_ENABLE_CSRF False 是否开启CSRF保护

内置的允许的文件类型:

default 所有 image 图片 audio 音频 video text 文本 app 程序

配置方式:

app.config['DROPZONE_ALLOWED_FILE_TYPE'] = 'image'

自定义文件类型:

app.config['DROPZONE_ALLOWED_FILE_CUSTOM'] = True app.config['DROPZONE_ALLOWED_FILE_TYPE'] = 'image/*, .pdf, .txt'

0 人点赞