浏览器文件夹上传 [英] Browser Folder Uploading

查看:574
本文介绍了浏览器文件夹上传的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我希望能够让用户上传包含其中所有文件和文件夹的文件夹,并仅使用浏览器将层次结构保留到我的网络应用程序。



<我已经搜索过,但没有找到如何做到这一点。每个人都说这是一个浏览器问题,我相信它是因为这样做没有浏览器标准。



我已经找到并玩了很多上传文件的javascript实现。当我将文件夹拖到它们上面时,我可以获得所有文件的列表,但文件夹和层次结构都已消失。如果我使用那些打开对话框来查找文件,那么它们都不允许选择文件夹。



那么Dropbox是如何做到的?



我可以将整个文件夹拖到Chrome或Safari(在我的Mac上)上,它们都会上传文件夹和文件,并在Dropbox中保留层次结构。



没有人知道他们是如何做到这一点的,所以我可以在我自己的基于浏览器的网络应用程序上做同样的事情吗?

解决方案

您必须在输入标记中添加一些参数以支持目录上传: webkitdirectory 用于基于Webkit的浏览器(例如Chrome)和<$ c对于Mozilla的浏览器(Firefox),$ c> mozdirectory 。



HTML代码可能如下所示:

 < input type =filewebkitdirectory mozdirectory ... /> 

您可以查看 https://stackoverflow.com/a/46562869 https://stackoverflow.com/a/8218074,这是类似问题的答案。


I would like to be able to have a user upload a folder with all the files and folders inside it and retain the hierarchy to my web app using just the browser.

I have searched and not found how to do this. Everyone says that it is a browser problem and I believe it because there is not browser standard for doing this.

I have found and played with many javascript implementations of uploading files. When I drag a folder onto them I can get the list of all the files, but the folders and hierarchy are all gone. If I use the ones that open a dialog to find a file none of them allow selecting a folder.

So how does Dropbox do it?

I can drag a whole folder onto either Chrome or Safari (on my mac) and both of them will upload the folders and files and retain the hierarchy in dropbox.

Doesn't anyone know how they do that so that I can do the same on my own web app that is browser based?

解决方案

You have to add some parameters to the input tag to support directory uploads: webkitdirectory for Webkit-based browsers (e.g., Chrome) and mozdirectory for Mozilla's browser (Firefox).

The HTML code could look like this:

<input type="file" webkitdirectory mozdirectory … />

You could have a look at https://stackoverflow.com/a/46562869 and https://stackoverflow.com/a/8218074, which are answers to similar questions.

这篇关于浏览器文件夹上传的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆