2012-07-12 53 views
12

Tôi đang cố gắng sử dụng JSON để bắt đầu yêu cầu POST đối với API.Sử dụng Yêu cầu POST JSON

Tôi đã tìm thấy một số mã ví dụ, và trước khi tôi nhận được quá xa Tôi muốn để làm việc đó, nhưng tôi bị mắc kẹt ...

<html> 
<head> 
<script type="text/javascript"> 
function JSONTest() 
{ 
requestNumber = JSONRequest.post(
    "https://example.com/api/", 
    { 
     apikey: "23462", 
     method: "example", 
     ip: "208.74.35.5" 
    }, 
    function (requestNumber, value, exception) { 
     if (value) { 
      processResponse(value); 
     } else { 
      processError(exception); 
     } 
    } 
); 
} 
</script> 
</head> 
<body> 

<h1>My JSON Web Page</h1> 


<button type="button" onclick="JSONTest()">JSON</button> 

</body> 
</html> 

Đây là một tập tin .html, mà tôi chạy bằng chrome. Không có gì xảy ra khi tôi nhấp vào nút ...

Tôi nghĩ rằng tôi thiếu một đoạn javascript diễn giải phản hồi JSON và có thể được hiển thị? nếu không có lời khuyên nào khác?

+0

Tôi đã theo ấn tượng JSON là một tập hợp con của Javascript ...? và vì vậy Javascript có thể chạy nó mà không có vấn đề gì? – GK1667

+0

JSON là định dạng trao đổi dữ liệu. Các trình duyệt hiện đại có thể hiểu được điều này, nhưng các trình duyệt cũ hơn cần một thư viện để có thể chuyển đổi các chuỗi JSON thành các đối tượng JavaScript. Tôi sẽ khuyên bạn nên sử dụng một thư viện như jQuery để giúp bạn với điều này, vì điều này cũng sẽ giải quyết một số vấn đề tương thích trình duyệt cho các khách hàng cũ. – Phil

+0

Hầu hết các trình duyệt hiện đại đều có sẵn một đối tượng JSON, nhưng JSONRequest không phải là một đối tượng hoặc hàm có sẵn trên cửa sổ hoặc các đối tượng tài liệu. – kinakuta

Trả lời

27

Ví dụ sử dụng jQuery ở bên dưới. Hy vọng điều này sẽ giúp

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<title>My jQuery JSON Web Page</title> 
<head> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript"> 

JSONTest = function() { 

    var resultDiv = $("#resultDivContainer"); 

    $.ajax({ 
     url: "https://example.com/api/", 
     type: "POST", 
     data: { apiKey: "23462", method: "example", ip: "208.74.35.5" }, 
     dataType: "json", 
     success: function (result) { 
      switch (result) { 
       case true: 
        processResponse(result); 
        break; 
       default: 
        resultDiv.html(result); 
      } 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
     alert(xhr.status); 
     alert(thrownError); 
     } 
    }); 
}; 

</script> 
</head> 
<body> 

<h1>My jQuery JSON Web Page</h1> 

<div id="resultDivContainer"></div> 

<button type="button" onclick="JSONTest()">JSON</button> 

</body> 
</html> 

Firebug quá trình debug

Firebug XHR debug process

+1

Đây là một ví dụ tuyệt vời! Vấn đề của tôi là nó nhận được gửi đến phần "yêu cầu lỗi". Tôi đã thay thế mọi thứ bằng dữ liệu nonexample nhưng vẫn không hoạt động. Tôi đã liên lạc với API này thành công và nhận được một respnose trở lại bằng cách sử dụng chức năng curl PHP và có người dùng nhập apikey, phương pháp, và ip trên một trang html mà bài viết cho php. Bất kỳ ý tưởng khác làm thế nào tôi có thể thực hiện điều này và nhận được một phản ứng bằng cách sử dụng javascript? – GK1667

+0

Xin chào. Tôi đã cập nhật trả lời của tôi ở trên, chỉ cần thay đổi xử lý lỗi, mà sẽ cung cấp cho bạn một số thông tin thêm về lỗi. Thông thường, nếu trình xử lý lỗi đó được gọi là một số lỗi giao thông/cors thường, như Jason đã đề cập. Hãy thử cập nhật mã và xem lỗi mới là gì. Tôi thực sự khuyên bạn nên cài đặt Fiddler hoặc sử dụng Google Chrome F12 Debug, vì vậy bạn có thể thấy 'chính xác' điều gì đang xảy ra 'dưới nắp ca-pô'. Cảm thấy tự do để lấy lại cho tôi :) – Phil

+0

Cảm ơn rất nhiều. Tôi thực sự đánh giá cao bạn gắn bó với tôi về điều này. Tôi đã làm việc về việc này với nhau trong vài ngày và thậm chí không thể kết nối! Dù sao, tôi đã thử bổ sung vào mã. Nó chỉ trả lại "0". Tôi có firebug chạy, tôi mới sử dụng nó, vì vậy nếu bạn có bất kỳ yêu cầu về những gì mảnh bạn muốn tôi kiểm tra tôi sẽ sẵn sàng làm như vậy! – GK1667

0

Trình duyệt hiện đại hiện không triển khai JSONRequest (theo như tôi biết) vì nó chỉ là bản nháp ngay bây giờ. Tôi đã tìm thấy một người đã triển khai nó như một thư viện mà bạn có thể đưa vào trang của mình: http://devpro.it/JSON/files/JSONRequest-js.html (xin lưu ý rằng nó có một số phụ thuộc).

Nếu không, bạn có thể muốn đi với một thư viện JS khác như jQuery hoặc Mootools.

Các vấn đề liên quan