1. 程式人生 > >Laravel的JsonResponse函式返回後前臺處理程式碼

Laravel的JsonResponse函式返回後前臺處理程式碼

情況1:Ajax提交表單後驗證失敗

這是經常發生的情況,所以特別記錄在此.這裡分兩種情況.

  • _token驗證失敗
  • 表單欄位驗證失敗

這裡先看一下返回的資料格式:

這裡寫圖片描述

其中有兩個重點:

  • responseJSON
  • state

其中responseJSON儲存著後臺返回的錯誤提示資訊的JSON物件,而在其之下的responseText則是字串型別.

state則是為了能辨別出錯誤的型別,_token驗證失敗的返回狀態碼是500,且返回的responseJSON是Laravel的錯誤提示頁面,而一般欄位驗證失敗(未人為修改返回狀態碼的情況下),返回狀態碼是422.所以當返回狀態碼是500的時候,我們不能直接輸出後臺響應,而是人為修改顯示資訊,比如alert("頁面發生錯誤,請重新整理重試");

這裡著重介紹第二種,即422的返回情況.

其實也就是一個js處理json物件的方式:

//這裡直接寫Ajax請求錯誤時執行的函式,即error:後執行的函式
function handleError(response){
    var responseJSON=response['responseJSON'];
    for(var fieldName in responseJSON){
        // 這裡直接輸出後臺顯示的錯誤資訊
        alert(responseJSON[fieldName]);
    }
}

重點就是for函式對JSON物件的迴圈.這裡順道再說一句fieldName

的內容就是欄位的名稱,像email password之類的.

情況2:請求正確

這個時候假設後臺返回的資訊是這樣的:

return new JsonResponse(array('message'=>"資料已正確儲存"),200);

這裡的200返回碼可以不輸入的,預設是200.後臺這樣返回之後,前臺的處理就比較簡單了.先看一下返回給前臺的資料格式:

這個時候讀取值就很方便了:

// 這裡是編寫Ajax返回正確後執行的函式,即success:
function handleSuccess(response){
    // 直接讀取JSON中的欄位即可
    var responseMessage=response.message;
    alert(responseMessage);
}