如何从Dropzone JS中的服务器响应(JSON)调用错误?

时间:2013-11-29 09:30:36

标签: javascript dropzone.js

我有一个上传者,当他们超过配额时拒绝用户上传。响应采用JSON格式,如下所示:

{msg: "Upload limit reached", status: "error", code: "403"}

Dropzone JS选项如下:

Dropzone.options.uploadDropzone = {
    paramName: "file1", 
    maxFilesize: 200, 
    maxThumbnailFilesize: 10,
    success: function(file, response){
      ????
  }
};

我应该如何处理success中的响应,以便在上传者中向我的用户显示错误?

5 个答案:

答案 0 :(得分:18)

好的以下内容可行,只需从源代码中提取:

success: function(file, response){
  if(response.code == 501){ // succeeded
    return file.previewElement.classList.add("dz-success"); // from source
  }else if (response.code == 403){  //  error
    // below is from the source code too
    var node, _i, _len, _ref, _results;
    var message = response.msg // modify it to your error message
    file.previewElement.classList.add("dz-error");
    _ref = file.previewElement.querySelectorAll("[data-dz-errormessage]");
    _results = [];
    for (_i = 0, _len = _ref.length; _i < _len; _i++) {
      node = _ref[_i];
      _results.push(node.textContent = message);
    }
    return _results;
  }
}

答案 1 :(得分:9)

Dropzone内置了错误检测功能。就这样做:

mydropzone = new Dropzone("#mydropzone",{
    url: "/dropzone",
    addRemoveLinks : true,
    maxFilesize: 2.0,
    maxFiles: 100,
    error: function(file, response) {
        if($.type(response) === "string")
            var message = response; //dropzone sends it's own error messages in string
        else
            var message = response.message;
        file.previewElement.classList.add("dz-error");
        _ref = file.previewElement.querySelectorAll("[data-dz-errormessage]");
        _results = [];
        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
            node = _ref[_i];
            _results.push(node.textContent = message);
        }
        return _results;
    }   
});

答案 2 :(得分:7)

你可以这样做:

success: function(file, response, action) {
    // PHP server response
    if(response == 'success') // Validate whatever you send from the server
    {
        this.defaultOptions.success(file);
    }
    else
    {
        this.defaultOptions.error(file, 'An error occurred!');  
    }
}

答案 3 :(得分:2)

在PHP方面:

keep_words <- function(text, keep) {
  words <- strsplit(text, " ")[[1]]
  txt <- paste(words[words %in% keep], collapse = " ")
  return(txt)
}
x <- "How much wood would a woodchuck chuck if a woodchuck could chuck wood? More wood than most woodchucks would chuck if woodchucks could chuck wood, but less wood than other creatures like termites."
keep_words(x, stopwords())
# [1] "would a if a could than most could if a could but than other"

并在jQuery方面:

    header("HTTP/1.0 400 Bad Request");
    echo "Error uploading file";

答案 4 :(得分:0)

尝试各种答案后,我发现当前的dropzone 5.5可以通过这种方式很好地工作:

在PHP方面,当您希望抛出错误时,请使用以下自定义状态文本设置标头400:

header('HTTP/1.1 400 Invalid file (test error).');
// no need to echo anything, unless you want more data to parse

然后使用完整的3个参数调整dropzone的错误选项:

mydropzone = new Dropzone("#mydropzone",{
    ....
    error: function(file, response, xhr) {
        console.log('errored',file,response,xhr);// for debugging
        if (typeof xhr !== 'undefined') {
            this.defaultOptions.error(file,xhr.statusText);// use xhr err (from server)
        } else {
            this.defaultOptions.error(file,response);// use default (from dropzone)
        }
    }   
});

然后将错误文本放入适当的dz框架中,以便使用其内置的CSS和悬停反馈显示正确的元素。