Angularjs JSONP không làm việc

Question

tôi có thể thiếu một cái gì đó ở đây nhưng tôi không thể làm cho công việc yêu cầu JSONP này, đây là mã:

var url = 'http://' + server + '?callback=JSON_CALLBACK'; 
$http.jsonp(url) 
    .success(function(data){ 
     console.log('success'); 
    }) 
    .error(function() { 
     console.log('error') 
    }); 

Yêu cầu bắn ok và tôi nhận được câu trả lời (với nội dung tiêu đề -Type: application/json) theo định dạng sau:

[{"id": "1", "name": "John Doe"}, 
    {"id": "2", "name": "Lorem ipsum"}, 
    {"id": "3", "name": "Lorem ipsum"}] 

Bạn có thấy gì không? Có lẽ định dạng tôi nên trả về từ máy chủ không đúng? Góc đánh chặn lỗi gọi lại mà không có bất kỳ thông báo lỗi nào ngoài thông báo tôi đã đặt ('lỗi').

Answer 1

JSONP yêu cầu bạn kết hợp dữ liệu của mình vào cuộc gọi hàm JavaScript. Về mặt kỹ thuật, bạn trả về một tệp JavaScript chứ không phải tệp Json.

Các dữ liệu trả về từ máy chủ nên tương tự như sau:

// the name should match the one you add to the url 
JSON_CALLBACK([ 
    {"id": "1", "name": "John Doe"}, 
    {"id": "2", "name": "Lorem ipsum"}, 
    {"id": "3", "name": "Lorem ipsum"} 
]); 

Sửa: Nếu một số ai khác tình cờ gặp phải vấn đề với JSONP góc của xin vui lòng cũng đọc this answer to this question, nó chứa thông tin hữu ích về cách góc cạnh xử lý thực tế chức năng gọi lại.

Answer 2

@ TheHippo là chính xác dữ liệu không chỉ là một phản hồi json đơn giản. Here is a working example yêu cầu JSONP đối với điểm cuối youtube trong AngularJS.

Một vài điều cần lưu ý trong ví dụ này:

• góc của $http.jsonp chuyển đổi các tham số chuỗi truy vấn yêu cầu callback=JSON_CALLBACK-callback=angular.callbacks._0.
• Khi gọi đến điểm cuối youtube tôi cần xác định cho dịch vụ rằng đây là yêu cầu JSONP bằng cách sử dụng alt=json-in-script thay vì alt=json trong chuỗi truy vấn. Số này được tìm thấy trong số documentation.
• So sánh kết quả của this url đến this one để xem sự khác biệt giữa phản hồi JSON và JSONP trong trình duyệt của bạn.
• Hãy xem Chrome Network Panel trong Công cụ dành cho nhà phát triển để giúp so sánh và khắc phục sự cố với yêu cầu/phản hồi của bạn.

Tôi biết ví dụ này rất cụ thể nhưng hy vọng điều đó sẽ hữu ích!

Answer 3

Nếu dữ liệu phản hồi là JSON "thuần túy", chúng tôi có thể xử lý nó với $ http.get của góc cạnh.

$http.get(url). 
    then(function(response) { 
    // this callback will be called asynchronously 
    // when the response is available 
    $scope.responseArray = response.data; 
}, function(response) { 
    // called asynchronously if an error occurs 
    // or server returns response with an error status. 
}); 

Tham khảo ví dụ về w3schools