WEBUPLOADER如何上传文件夹

百度WebUploader组件如何上传文件夹？在他们官网找过，就给了一句话，打开一个属性就完了，具体细节就没细说了。如何续传，如何保存层级结构，服务器如何将层级结构写到数据库中，下载文件夹时如何保存层级结构，如何解决刷新续传的问题，这些关键点都没说，单纯的只提了一句在HTML标签里面加一个属性。

网上搜了一下，基本上大部分的文章里面提到的前端JS或VUE或HTML5上传文件夹的方案都是使用JS的API来实现的，也就是html5提供的一个API，也就是chrome提供的API。用是能用，但是不够好用，有很多限制，也不够灵活。不太能够满足用户的实际应用需求，

我们做项目的话个人用户比较少，一般都是行业用户，比如政府，公司，金融，这类企业，他们对用户体验要求较高。就实际项目开发和实施的情况来看，html5或者chrome提供的功能基本上都是不能够满足他们需求的，都需要我们进行定制开发。就说文件夹上传吧，html5提供了API,用户开始用的时候还行，然后就提了要求要求支持断点续传，

1.下载示例

https://gitee.com/xproer/up6-vue-cli

 

 

将up6组件复制到项目中

示例中已经包含此目录

 

 

1.引入up6组件

 

 

2.配置接口地址

接口地址分别对应：文件初始化，文件数据上传，文件进度，文件上传完毕，文件删除，文件夹初始化，文件夹删除，文件列表

参考：http://www.ncmem.com/doc/view.aspx?id=e1f49f3e1d4742e19135e00bd41fa3de

 

 

3.处理事件

 

 

启动测试

 

 

启动成功

 

 

效果

 

 

数据库