你怎么能检测到用户拖动一个文件夹（不是文件）到他们的浏览器？ [英] How can you detect that a user dragged a folder (not a file) into their browser?

问题描述

我非常清楚地知道你不允许通过拖放上传整个文件夹。问题是，我怎么能知道，如果有人试图做到这一点？如果您拖动文件夹到浏览器中，它的行为完全一样，如果你拖了一些扩展的WebKit不知道，像.SH的文件。你怎么知道有什么区别？

我在Chrome和Safari和Firefox在Mac OS X和Windows测试此。根据不同的浏览器和操作系统上，我得到稍有不同的结果。有时它成功地上传一个零字节的文件。有时它上传的文件夹的图片。有时候，它无法上传任何东西。

event.dataTransfer.types和event.dataTransfer.items都撒谎说的类型分别为文件或文件。

火狐给出了类型此列表：

  {0：应用程序/ x-MOZ文件，1：文/ X-MOZ-URL，2：text / plain的 3：文件}
 

解决方案

我找到了一种方法来做到这一点。该信息可通过dataTransfer.items getAsEntry可以发现，尽管它在不同的浏览器有所不同。此外，这并不有一个指针回到你想要的文件，但你可以根据文件名假设你没有在同一时间上传两个文件具有相同名称看着办吧。有没有真的很多在这里工作，所以这是我能做的最好的。

  just_the_files =（dataTransfer） -  GT;
    real_files_set = {}
    在dataTransfer.items项目
        进入= item.getAsEntry？（）或item.webkitGetAsEntry？（）或项目
        如果entry.isFile
            real_files_set [entry.name] =真
     （文件中dataTransfer.files文件时real_files_set的file.name）
 

I know very well that you are not allowed to upload a whole folder via drag and drop. The problem is, how can I tell if someone tries to do it? If you drag a folder into the browser, it behaves exactly as if you dragged a file with some extension webkit doesn't know about, like '.sh'. How can you tell the difference?

I have tested this in Chrome and Safari and Firefox on Mac OS X and Windows. Depending on the browser and OS, I get slightly different results. Sometimes it succeeds in uploading a zero-byte file. Sometimes it uploads a picture of a folder. Sometimes it fails to upload anything.

event.dataTransfer.types and event.dataTransfer.items both lie and say the type is "File" or "file" respectively.

Firefox gives this list of types:

{"0":"application/x-moz-file","1":"text/x-moz-url","2":"text/plain","3":"Files"}

解决方案

I found a way to do it. The information can be found in dataTransfer.items via getAsEntry, though it's a little different in different browsers. Also, this doesn't have a pointer back to the file you wanted, though you can figure it out based on the file name assuming you're not uploading two files with the same name at the same time. There's not really much to work with here, so this is the best I could do.

just_the_files = (dataTransfer) ->
    real_files_set = {}
    for item in dataTransfer.items
        entry = item.getAsEntry?() or item.webkitGetAsEntry?() or item
        if entry.isFile
            real_files_set[entry.name] = true
     (file for file in dataTransfer.files when file.name of real_files_set)

这篇关于你怎么能检测到用户拖动一个文件夹（不是文件）到他们的浏览器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！