jQuery $ .ajax thực hiện gọi lại không bắn

Question

Tôi có đoạn mã sau:

$("#loginSubmitButton").on("click",function(){ 
    var loginUserDetails = { 
    email: $("#email").val(), 
    password: $("#password").val() 
    }; 

    //Send the AJAX request to authenticate the user 
    $.ajax({ 
    type: "POST", 
    url: "/somewebservice/v1/users/authenticate", 
    data: JSON.stringify(loginUserDetails), 
    contentType: "application/json;charset=UTF-8", 
    dataType: "json", 
    }).done(function() { 
     $("#loginResult").text("Login successful"); 
    }) 
    .fail(function() { 
     $("#loginResult").text("Login failed"); 
    }); 

}); 

Theo tài liệu jquery (trừ khi tôi đang tìm hiểu một cái gì đó không chính xác) Tôi hy vọng thực hiện để bị sa thải nếu tôi nhận được một 200 OK từ máy chủ web của tôi. Tuy nhiên, trong giao diện điều khiển chrome tôi có thể nhìn thấy một phản ứng 200 OK nhưng jquery dường như để bắn xử lý thất bại.

Có ai có ý tưởng gì về việc tôi có thể làm sai ở đây không?

Answer 1

Cần loại bỏ, từ datatype: "json",

dataType: "json" 

Answer 2

Một số điều cần làm sáng tỏ vấn đề của bạn và một vài gợi ý nói chung.

1. Đừng nghe nhấp chuột vào nút gửi. Bạn nên đợi sự kiện gửi trên biểu mẫu.

2. Tùy chọn data cho $.ajax không mong đợi chuỗi JSON. Nó muốn một chuỗi tuần tự hoặc một mảng với các đối tượng tên và giá trị. Bạn có thể tạo một trong hai cách dễ dàng với .serialize() hoặc .serializeArray().

Đây là những gì tôi đang nghĩ về kịch bản của bạn.

$('#form-with-loginSubmitButton').on('submit', function(e){ 


    e.preventDefault(): 

    var $form = $(this), 
     data = $form.serializeArray(); 

    $.ajax({ 
    type: "POST", 
    url: "/somewebservice/v1/users/authenticate", 
    data: data 
    }).done(function(result){ 
    console.log(result); 
    }); 

}); 

Answer 3

Bạn cần phải loại bỏ:

dataType: "json"

Answer 4

Nếu máy chủ của bạn trả về chuỗi rỗng cho một phản ứng json (thậm chí nếu có một 200 OK), jQuery đối xử với nó như là thất bại. Kể từ v1.9, một chuỗi rỗng được coi là json không hợp lệ.

Dù là nguyên nhân, một nơi tốt để nhìn vào là tham số 'dữ liệu' truyền cho callbacks:

$.ajax(..).always(function(data) { 
    console.log(JSON.stringify(data)); 
}); 

nội dung của nó sẽ cung cấp cho bạn một sự hiểu biết về những gì sai.

Answer 5

Có rất nhiều gợi ý để loại bỏ

dataType: "json" 

Trong khi Tôi cho rằng việc này nó có thể bỏ qua những vấn đề tiềm ẩn. Rất có thể do lỗi trình phân tích cú pháp (trình duyệt phân tích phản hồi json). Trước tiên, kiểm tra tham số XHR trong hoặc .always() hoặc .fail().

Giả sử nó là một trình phân tích cú pháp không thành công thì tại sao? Có lẽ chuỗi trả về không phải là JSON. Hoặc nó có thể là khoảng trống không đúng lúc bắt đầu phản hồi. Hãy xem xét có một cái nhìn vào nó trong fiddler. Tôi trông giống như thế này:

Connection: Keep-Alive 
Content-Type: application/json; charset=utf-8 

{"type":"scan","data":{"image":".\/output\/ou... 

Trong trường hợp của tôi, đây là vấn đề với việc PHP phun ra các ký tự không mong muốn (trong trường hợp này là tập tin UTF). Khi tôi đã xóa những lỗi này, nó đã khắc phục sự cố trong khi vẫn giữ

dataType: json 

Answer 6

URL ajax phải là cùng một tên miền. Bạn không thể sử dụng AJAX để truy cập các tập lệnh tên miền chéo.Điều này là do Chính sách xuất xứ giống nhau.
add "datatype: JSONP" để đạt được qua thông tin liên lạc miền

sử dụng mã dưới đây

$.ajax({ 
     URL: cross domain 

     dataType: 'jsonp' 
      // must use dataType:JSONP to achieve cross domain communication, otherwise done function would not called. 
      // jquery ajax will return "statustext error" at }).always(function(data){} 


}).always(function(data){ 
     alert(JSON.stringify(data)); 
    }