拖放上传需提供选择文件
别名: 选择文件 · input type file · 不拖也能传
概念解释
把文件拖进虚线框是常见的上传主路径。键盘、开关、许多辅助技术没有「抓起桌面上的文件再丢进浏览器」这条动作。替代控件是选择文件:原生文件选择器、系统分享表、或「浏览」按钮打开的等价选择 UI。没有选择器,只留拖放区,上传对非指针用户关闭。
这条指定的就是这一种控件,不是排序用的上移下移,也不是「任意点击替代」的存在性声明。
机制
拖放上传跨了两个世界:操作系统的文件对象和浏览器里的放置目标。连接靠指针的拖出与拖入。键盘用户活在页面文档里,到不了桌面图标;移动端辅助触控也很难把系统文件夹里的项拖进 WebView。文件选择器把同一连接改成一次显式的系统对话:用户在自己的文件 UI 里挑选,挑选结果以文件列表的形式交给页面。通路换了,载荷仍是文件。
只把拖放区做成「看起来也能点」却没有 input type="file" 或等价 API,点击会无事发生。只在拖放失败后的错误文案里写「请使用桌面客户端」,也不是选择器。选择器必须是页面内可聚焦、可激活的入口。
怎么研究
禁用指针(或只用键盘 / 开关),在上传组件上寻找「选择文件 / 浏览 / 添加」并走完一次本地文件上传。记录:入口是否在 Tab 序列中、系统选择器是否打开、选中后是否与拖放同一条处理管道。
对照:用拖放传同一个文件,看成功条件和错误提示是否同一套。若选择器只能传单文件而拖放能传目录,记到能力等价那条,这条先确认选择器存在并能传至少一个文件。
边界
原生应用若已接入系统文件提供器(iOS 文件、Android 存储访问框架),那就是选择器,不必再仿一个网页虚线框。纯剪贴板粘贴图片可以作为附加通路,不能代替选择器——不是所有文件都在剪贴板里。相机现场拍照是另一种来源,对「从已有文件上传」仍要保留选择器。内网磁盘映射、扫描件进文件夹这类环境,选择器比拖放更贴近真实工作方式。
怎么落地
- 每个拖放上传区配一个可聚焦的「选择文件」或「浏览」,打开系统文件选择器。
- 选择器与拖放走同一套校验、进度和错误处理,不要做成两个互不相认的上传。
- 验证:不拖任何东西,用键盘打开选择器并传一个允许类型的文件。入口找不到或激活无反应,拖放上传没有选择文件这条替代。