【问题标题】:Get uploaded file from Dropzone从 Dropzone 获取上传的文件
【发布时间】:2014-05-21 10:45:48
【问题描述】:

我有一个 Web API 方法来上传文件并返回包含文件路径的 FileResult 对象。如何在 dropzone 中获取上传文件的文件路径(如何从 Web API 方法获取响应)?

我的拖放区:

module.directive("dzDirective", [
    'apiAttachment', function(apiAttachment) {
        return {
            restrict: "A",
            link: function(scope, iElement, iAttrs, controller) {
                iElement.dropzone({
                    url:"/api/1/FileTransfer",
                    uploadMultiple: false,
                    init: function() {
                        var myDropzone = this;
                        myDropzone.on("complete", function (file) {
                            DoSomething();
                        });
                    }
                });
            }
        };
    }
]);

我的 Web Api 方法:

[Route("api/1/FileTransfer")]
    public async Task<FileResult> Post()
    {
        if (!Request.Content.IsMimeMultipartContent("form-data"))
        {
            throw new HttpResponseException(Request.CreateResponse(HttpStatusCode.UnsupportedMediaType));
        }

        var storageFactory = new StorageFactory();
        var streamProvider = new StorageProvider(storageFactory.Create(storage, tempContainer));
        await Request.Content.ReadAsMultipartAsync(streamProvider);
        return new FileResult
        {
            FilePaths = streamProvider.Files
        };
    }

文件结果模型

public class FileResult
{
    public IEnumerable<string> FilePaths { get; set; }
    public string Submitter { get; set; }
}

谢谢!

【问题讨论】:

  • 这个回调文件属性myDropzone.on("complete", function (file) {有什么内容
  • 其实就是文件名是文件名,不是FileResult类型(包含文件路径)
  • 是的,你是对的。我刚刚检查了回调myDropzone.on("complete", function (file).. 并且file 中有一个属性xhr 包含来自API post 方法的响应。感谢您的帮助!

标签: javascript angularjs asp.net-web-api angularjs-directive dropzone.js


【解决方案1】:

只需将此 sn-p 添加到您的 dropzone 初始化程序中

 Dropzone.options.formUpload = {
    init: function() {
        this.on("success", function(data) {
            var response = $.parseJSON(data.xhr.response);
        });
    }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-11-28
    • 1970-01-01
    • 2014-03-27
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多