最佳方法拖放上传.NET答案

【问题标题】：Best approach drag drop upload .NET最佳方法拖放上传.NET
【发布时间】：2011-11-19 06:15:18
【问题描述】：

我一直试图找出一个可靠的解决方案，在使用 .NET 的 Web 应用程序上提供拖放上传部分。我已经用 Silverlight 4 进行了实验，但如果不使用浏览器，则无法以这种方式使用此功能。

我已经阅读了这些文章

file upload via drag and drop

file upload using drag drop

但他们都引用了http://www.plupload.com/，这很酷，但我想开发自己的解决方案。

有人对方法有建议吗？您是否必须使用客户端技术来完成大部分工作，然后将数据发送到服务器，或者......好吧，我只是不确定。我意识到大多数人会选择使用其他人的解决方案或工具包......但是，嘿，这有什么乐趣？ :)

【问题讨论】：

标签： .net drag-and-drop

【解决方案1】：

最好的方法是使用 Silverlight.. 至少这是我发现的。转到this guys 示例，并分析他如何使用Web 服务。我拿了这个，用 WCF RIA 服务替换了他所有的 web 服务，然后 bam!.. 就像一个魅力。如果你把它弄乱了一段时间，你会发现有很多方法可以抛出 FileSteam 或 Byte() 如果你想把它保存到磁盘...任何人，这是我对我自己问题的回答.注意：要让 SL 拖放在 Mac 浏览器上工作，需要额外的编码（拖放事件需要在 JS 中处理，而不是在 SL 中）。

如果 HTML5 是一个选项，使用新的 JS 'drop' 事件也很有效。使用它时的一个关键点是防止'dragover'、'dragenter'和'drop'的默认值

function ConfigDropElement() {

    document.getElementById('dragarea').addEventListener("dragover", handleDragOver, false);

    document.getElementById('dragarea').addEventListener("dragenter", function (e) { e.preventDefault(); }, false);

    document.getElementById('dragarea').addEventListener("drop", function (event) {

        event.preventDefault();
        event.stopPropagation();

        for (var i = 0; i < event.dataTransfer.files.length; i++) {

            var file = event.dataTransfer.files[i];

            var fi = new FileInfoElement();
            fi.WriteInfo(file.name);

            var reader = new FileReader();
            reader.readAsDataURL(file);

            var fi = new FileInfoElement();
            fi.WriteInfo(file.name);


        }



    }, false);

}

【讨论】：