原生不支持多文件夹选择，因webkitdirectory是单目录私有扩展，multiple对其无效；必须用拖放API配合webkitGetAsEntry()递归遍历多个文件夹，并上传文件及对应fullPath以还原目录结构。
原生 <input type="file"> 不支持同时选择多个文件夹，这是硬性限制，不是配置问题。想实现“批量文件夹上传”，必须绕过 <input>，改用拖放（Drag & Drop）API + webkitGetAsEntry() 或现代 FileSystemDirectoryHandle（仅 Chromium 系列支持）来遍历多个文件夹结构。
为什么 webkitdirectory 只能选一个文件夹？
这个属性是 WebKit/Blink 内核的私有扩展，设计初衷就是单目录选择。即使加了 multiple，浏览器也只允许用户在文件对话框里点一次、选一个目录——multiple 对它完全无效。
-
<input type="file" webkitdirectory multiple>在 Chrome/Firefox/Safari 中行为一致：只弹出单目录选择框，multiple被忽略 - 选中的
FileList里只有一个File对象，但它的webkitRelativePath是空字符串，无法还原层级 - Firefox 和 Safari 已明确不支持
webkitdirectory，仅 Chrome/Edge 有效，且无跨平台替代方案
用拖放 API 获取多个文件夹的真实路径结构
用户把多个文件夹拖进页面区域后，通过 event.dataTransfer.items 拿到 DataTransferItem，再调用 webkitGetAsEntry() 得到 FileSystemEntry（Chrome/Edge），然后递归读取子项。这是目前唯一可靠的方式。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 必须监听
dragover并调用event.preventDefault()，否则drop事件不会触发 -
item.webkitGetAsEntry()返回的是FileSystemDirectoryEntry或FileSystemFileEntry，不是File，不能直接丢给FormData - 需手动递归调用
createReader().readEntries()，把每个File实例提取出来，并拼接fullPath作为服务端还原目录结构的依据 - 示例关键片段：
dropzone.addEventListener('drop', async (e) => { e.preventDefault(); const items = Array.from(e.dataTransfer.items); for (const item of items) { if (item.kind === 'file') { const entry = item.webkitGetAsEntry(); if (entry && entry.isDirectory) { await traverseDir(entry, []); } } } });
服务端如何保留上传的文件夹层级？
前端不能只传 File 对象，必须把每个文件的相对路径（如 /project/src/index.js）作为额外字段一并上传。否则服务端收到的只是扁平文件流，无法重建结构。
立即学习“前端免费学习笔记（深入）”；
- 构建
FormData时，对每个File添加两个字段：formData.append('files', file)+formData.append('paths', fullPath) - 后端接收时，按顺序配对
files[i]和paths[i]，用path.join(uploadRoot, paths[i])确保写入正确子目录 - 注意路径校验：过滤掉
../、绝对路径开头（/或C:\）等恶意构造，避免路径遍历漏洞 - Node.js 示例中，
multer默认不解析多字段，需配合busboy或自定义中间件处理混合字段
真正难的不是“怎么选”，而是“怎么让成千上万个嵌套文件不卡死主线程、不爆内存、还能断点续传”。递归读取大目录时，要用 setTimeout 或 queueMicrotask 分片处理；上传队列得加并发控制；每个文件的 File 实例本身不包含路径信息，全靠前端在遍历时手工维护——这点最容易漏，导致服务端收到一堆同名文件却不知该放哪层。
