jQuery.FileUpload HTTP響應錯誤

Question

我使用blueimp的jQuery.fileUpload組件來構建使用Laravel 5的應用程序的一部分。表單本身按預期工作，但我很難處理服務器端驗證：

Laravel的請求驗證處理ajax請求的後端驗證，當驗證失敗時，響應以HTTP 422代碼發送。

主要問題是blueimp的jQuery.fileUpload不能解析包含驗證消息的file（json）數組(doc. link)。相反，它只是使用HTTP 422代碼的標準描述。

你們是否知道一種重寫方法？我如何手動解析驗證返回的json？或者是否有辦法讓Laravel返回HTTP 200，即使驗證失敗？

下面是一些代碼：

Laravel的Request類：

class UploadRequest extends Request { 

     /** 
     * Determine if the user is authorized to make this request. 
     * 
     * @return bool 
     */ 
     public function authorize() 
     { 
      return true; 
     } 

     /** 
     * Get the validation rules that apply to the request. 
     * 
     * @return array 
     */ 
     public function rules() 
     { 
      Log::info("Request de upload"); 
      return [ 
       'file' => 'required|max:1200' 
      ]; 
     } 
    } 

這是我的jQuery.fileUpload初始化腳本：

$(function() { 
    'use strict'; 
    var jupload = $('#fileupload'); 
    jupload.fileupload({ 
     url: window.location 
    }); 

    // from http://stackoverflow.com/a/21728472 
    if (typeof existingfiles !== 'undefined'){ 
     jupload.fileupload('option', 'done').call(jupload, $.Event('done'), {result: existingfiles}); 
    }; 
}); 

在此先感謝， 肖託。

Answer 1

幾天前我有同樣的問題...如果你看看每個回調中可用的對象data，你會發現它在另一個對象jqXHR（畢竟我們只處理一個jQuery AJAX調用），它有另一個對象responseJSON，它帶有一個數組，其中包含要查找的錯誤。

從官方blueimp docs：

「的發送方法返回一個jqXHR對象，它允許回調綁定到AJAX文件上傳請求（S）：」 所以現在

var jqXHR = $('#fileupload').fileupload('send', {files: filesList}) 
.success(function (result, textStatus, jqXHR) {/* ... */}) 
.error(function (jqXHR, textStatus, errorThrown) {/* ... */}) 
.complete(function (result, textStatus, jqXHR) {/* ... */}); 

，你可以這樣做......

$('#fileupload').fileupload({ 
    fail: function (e, data) { 
     var errors = data.jqXHR.responseJSON; 
     $.each(errors, function (key, value) { 
      alert(value); 
     }); 
    } 
}); 

或者，也許更合適：

var jqXHR = data.submit() 
     .success(function (result, textStatus, jqXHR) {/* ... */}) 
     .error(function (jqXHR, textStatus, errorThrown) { 
      console.log(data); 
      var errors = jqXHR.responseJSON; 
      $.each(errors, function (key, value) { 
       alert(value); 
      }); 
     }) 
     .complete(function (result, textStatus, jqXHR) {/* ... */});