解决webuploader 拖动上传文件夹获取不了路径的问题

本文介绍如何使用WebUploader组件实现拖动上传文件夹的功能,并详细解释了如何获取拖动上传文件夹内文件的完整路径及为文件分配统一的文件夹ID。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

webuploader组件选择上传文件夹,可以在源码里面给input标签新增webkitdirectory属性(见上一篇文章:webuploader上传文件夹),如果是拖动上传怎么处理?

打开webuploader.js,在4755行左右 找到_traverseDirectoryTree 方法中,找到 if (entry.isFile)这个判断,在 entry.file(function (file)这个方法中新增一列 file.fullPath = entry.fullPath; 如下图:
在这里插入图片描述
这样就得到了拖动上传文件夹,文件的路径了
在这里插入图片描述
如果后端要通过一个唯一值去处理这些文件是否属于同一个文件夹,前端在拖动文件夹的时候可以生成一个唯一标识去识别,比如拖动文件夹,可以在4702行左右,找到me._getTansferFiles方法,在遍历文件的时候,给当前遍历的文件都赋值同一个文件夹id,如图:
在这里插入图片描述
控制台输出得到:
在这里插入图片描述

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值