Javascript 如何从Dropzone JS中的服务器响应（JSON）调用错误？

我有一个上传器，当用户超过他们的配额时，它会拒绝用户的上传。响应是JSON格式的，如下所示：

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

{msg:“已达到上载限制”，状态：“错误”，代码：“403”}

Dropzone JS选项如下所示：

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

---

我应该如何处理

success

中的响应，以便在上载程序中向我的用户显示错误？

好的，以下操作可以，只需从源代码中提取：

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;
  }
}

success:函数（文件、响应）{
如果（response.code==501）{//成功
返回文件.previewElement.classList.add（“dz成功”）；//来自源代码
}如果（response.code==403）{//error
//下面也是源代码
var节点，i，len，ref，results；
var message=response.msg//将其修改为您的错误消息
file.previewElement.classList.add（“dz错误”）；
_ref=file.previewElement.querySelectorAll（“[data dz errormessage]”）；
_结果=[]；
对于（_i=0，_len=_ref.length；_i<_len；_i++）{
节点=_ref[_i]；
_results.push（node.textContent=message）；
}
返回结果；
}
}

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;
    }   
});

mydropzone=新的Dropzone（#mydropzone“{
url:“/dropzone”，
addRemoveLinks：是的，
maxFilesize:2.0，
最大文件数：100，
错误：函数（文件、响应）{
if（$.type（响应）=“string”）
var message=response；//dropzone以字符串形式发送自己的错误消息
其他的
var message=response.message；
file.previewElement.classList.add（“dz错误”）；
_ref=file.previewElement.querySelectorAll（“[data dz errormessage]”）；
_结果=[]；
对于（_i=0，_len=_ref.length；_i<_len；_i++）{
节点=_ref[_i]；
_results.push（node.textContent=message）；
}
返回结果；
}   
});

在PHP端：

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

在jQuery端：

        error: function(response){
            alert(response.xhr.responseText);
        }

---

您可以这样做：

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!');  
    }
}

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

---

在尝试了各种答案之后，我发现当前的dropzone 5.5通过以下方式运行良好：

在PHP端，当您希望抛出错误时，使用自定义状态文本将标题设置为400，如下所示：

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!');  
    }
}

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和悬停反馈显示正确的元素。

刚刚尝试过，但有任何副作用吗？因为我担心直接调用默认函数会覆盖我的调用。您可以从

错误：

handler中调用

this.defaultOptions.error

，而不是在

成功：

处理程序中选中“success”。

错误：

处理程序这并不能帮助我找到确切的解决方案，但这有助于我理解当时的情况，我解决了我所面临的问题，因此进行了投票。