(数据科学学习手札114)Python+Dash快速web应用开发——上传下载篇

   这是我的系列教程Python+Dash快速web应用开发的第十一期,在之前两期的教程内容中,我们掌握了在Dash中创建完善的表单控件的方法。

  而在今天的教程中,我们将介绍如何在Dash中高效地开发web应用中非常重要的文件上传下载功能。

(数据科学学习手札114)Python+Dash快速web应用开发——上传下载篇

图1 2 在Dash中实现文件上传与下载 2.1 在Dash中配合dash-uploader实现文件上传

  其实在自带的dash_core_components中就封装了基于html5原生API的dcc.Upload()组件,可以实现简单的文件上传功能,但说实话,非常的不好用,其主要缺点有:

文件大小有限制,150M到200M左右即出现瓶颈

策略是先将用户上传的文件存放在浏览器内存,再通过base64形式传递到服务端再次解码,非常低效

整个上传过程无法配合准确的进度条

  正是因为Dash自带的上传部件如此不堪,所以一些优秀的第三方拓展涌现出来,其中最好用的要数dash-uploader,它解决了上面提到的dcc.Upload()的所有短板。通过pip install dash-uploader进行安装之后,就可以直接在Dash应用中使用了。

  我们先从极简的一个例子出发,看一看在Dash中使用dash-uploader的正确姿势:

app1.py

import dash import dash_uploader as du import dash_bootstrap_components as dbc import dash_html_components as html app = dash.Dash(__name__) # 配置上传文件夹 du.configure_upload(app, folder='temp') app.layout = html.Div( dbc.Container( du.Upload() ) ) if __name__ == '__main__': app.run_server(debug=True)

(数据科学学习手札114)Python+Dash快速web应用开发——上传下载篇

图2

  可以看到,仅仅十几行代码,我们就配合dash-uploader实现了简单的文件上传功能,其中涉及到dash-uploader两个必不可少的部分:

2.1.1 利用du.configure_upload()进行配置

  要在Dash中正常使用dash-uploader,我们首先需要利用du.configure_upload()进行相关配置,其主要参数有:

  app,即对应已经实例化的Dash对象;

  folder,用于设置上传的文件所保存的根目录,可以是相对路径,也可以是绝对路径;

  use_upload_id,bool型,默认为True,这时被用户上传的文件不会直接置于folder参数指定目录,而是会存放于du.Upload()部件的upload_id对应的子文件夹之下;设置为False时则会直接存放在根目录,当然没有特殊需求还是不要设置为False。

  通过du.configure_upload()我们就完成了基本的配置。

2.1.2 利用du.Upload()创建上传部件

  接下来我们就可以使用到du.Upload()来创建在浏览器中渲染供用户使用的上传部件了,它跟常规的Dash部件一样具有id参数,也有一些其他的丰富的参数供开发者充分自由地自定义功能和样式:

  text,字符型,用于设置上传部件内显示的文字;

  text_completed,字符型,用于设置上传完成后显示的文字内容前缀;

  cancel_button,bool型,用于设置是否在上传过程中显示“取消”按钮;

  pause_button,bool型,用于设置是否在上传过程中显示“暂停”按钮;

  filetypes,用于限制用户上传文件的格式范围,譬如['zip', 'rar', '7zp']就限制用户只能上传这三种格式的文件。默认为None即无限制;

  max_file_size,int型,单位MB,用于限制单次上传的大小上限,默认为1024即1GB;

  default_style,类似常规Dash部件的style参数,用于传入css键值对,对部件的样式进行自定义;

  upload_id,用于设置部件的唯一id信息作为du.configure_upload()中所设置的缓存根目录的下级子目录,用于存放上传的文件,默认为None,会在Dash应用启动时自动生成一个随机值;

  max_files,int型,用于设置一次上传最多可包含的文件数量,默认为1,也推荐设置为1,因为目前对于多文件上传仍有进度条异常上传结束显示异常等bug,所以不推荐设置大于1。

  知晓了这些参数的作用之后,我们就可以创建出更符合自己需求的上传部件:

app2.py

import dash import dash_uploader as du import dash_bootstrap_components as dbc import dash_html_components as html app = dash.Dash(__name__) # 配置上传文件夹 du.configure_upload(app, folder='temp') app.layout = html.Div( dbc.Container( du.Upload(, text='点击或拖动文件到此进行上传!', text_completed='已完成上传文件:', cancel_button=True, pause_button=True, filetypes=['md', 'mp4'], default_style={ 'background-color': '#fafafa', 'font-weight': 'bold' }, upload_id='我的上传' ) ) ) if __name__ == '__main__': app.run_server(debug=True)

(数据科学学习手札114)Python+Dash快速web应用开发——上传下载篇

图3

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wsxgyy.html