如何指定<input capture>捕获媒体文件的存储位置？

嗨，针对你问的这个<input capture>存储位置的问题，我来给你理理清楚～

首先得给你一个明确的结论：目前没有直接的方式能通过<input capture>指定捕获媒体文件的存储目录。这是因为<input capture>的本质是调用系统原生的相机/媒体捕获界面，文件存在哪儿完全是操作系统说了算——浏览器出于安全和平台规范的限制，根本没权限去改这个系统级的存储路径。不同平台的处理还不一样：iOS上会存到相机胶卷，Android一般放DCIM或者系统默认的媒体文件夹，这些路径都是浏览器沙箱碰不到的。

针对你提到的两个临时方案，我可以给你补充些优化思路，帮你降低它们的“次优”感：

方案1：把拿到的File复制到navigator.storage.getDirectory()目录 #

这个方案的痛点确实是双倍占空间、系统文件夹变乱，还有Safari的兼容问题，但可以做些调整：

• 缓解内存压力：别一次性把整个大视频都读进内存，用流式API（Streams API）来分块复制，这样哪怕是几个G的视频，也不会把浏览器搞崩。
• 简化Safari兼容：现在Safari 15.4+已经支持FileSystemWritableFileStream了，你可以用统一的流式写入逻辑来处理复制，不用写一堆专属的hack代码。
• 系统文件夹冗余的处理：可惜浏览器没权限直接删掉系统目录里的原文件，但你可以在复制完成后给用户加个友好提示，比如“视频已导入应用专属存储，你可以去系统相册/DCIM文件夹删掉原文件节省空间”，引导用户手动清理。

方案2：用getUserMedia() + MediaRecorder + 文件系统API手动搞整套流程 #

这个方案确实代码量会多一些，但也有它的长期优势：

• 可封装复用：你可以把捕获、录制、存储这一套逻辑封装成一个独立的工具函数或者类，后面项目里直接调用就行，不用重复写一堆代码。
• Safari兼容优化：现在iOS 14.5以上的Safari已经支持基本的MediaRecorder视频录制了，只要你选兼容性好的编码格式（比如H.264），大部分场景都能正常跑。而且这个方案全程都在你的控制之下，从拍视频到存文件全流程自己管，后面用getFileHandle()读文件也更顺，长期维护起来其实更省心。

有没有其他新的可能性？ #

目前W3C的规范里还没计划给<input capture>加指定存储目录的属性——毕竟涉及到系统级的存储权限，浏览器为了安全不敢随便开这个口子，怕被恶意网站滥用。不过你可以多关注File System Access API的后续更新，说不定以后会出更灵活的媒体捕获+存储结合的特性。

总的来说，如果你的项目要快速上线、迭代，优化后的方案1会更合适；如果你的APP对存储效率、长期可维护性要求更高，方案2虽然前期写代码麻烦点，但后面的体验和可控性会好很多。

内容来源于stack exchange