2010-09-02 80 views
2

我發佈JSON請求到遠程服務。一切都好,服務工作正常,它迴應我。但是我沒有從遠程服務返回的數據。如何通過.post從JQuery獲取遠程json服務的數據?爲什麼這個例子返回的數據 - ``空':爲什麼JQuery的.post沒有返回數據?

<SCRIPT> 
$(function() { 
    $('#zzz').click(function() { 
     $('#lak').html('wait...'); 
     $.post(
    'http://127.0.0.1:3000/test', 
    "{\"ipaddr\":\"192.168.132.58\"}", 
    function(data) { alert(data); }, 
    "json" 
     ) 
    }); 
}); 
</SCRIPT> 

但TCP嗅探器顯示我,服務返回一些數據:

HTTP/1.1 200 OK 
Connection: Keep-Alive 
Content-Type: application/json 
X-Powered-By: Mojolicious (Perl) 
Date: Thu, 02 Sep 2010 06:17:10 GMT 
Content-Length: 37 
Server: Mojolicious (Perl) 

{"status":"OK","result":"successful"} 

解決:

<SCRIPT> 
$(function() { 
    $('#clickme').click(function() { 
$.getJSON('http://domain.tld/test/?foo=bar&callback=?', 
function(jsonp) { 
    $('#jsonp-example').html(jsonp.result); 
}); 
    }); 
}); 
</SCRIPT> 

<div id="jsonp-example"><a id="clickme" href="javascript:void()">Click me</a></div> 

Mojolicious JSONP服務的例子:

# /test/?foo=bar&callback=smth 
get '/test' => sub { 
my $self = shift; 

my $foo = $self->param('foo') || ''; 
my $callback = $self->param('callback') || 'jsonp'; 
... 
my $json = $self->render(
    json => { 
    'status' => 'OK', 
    'result' => 'successful' 
    }, 
    partial => 1); 

$self->render(data => "$callback($json)", format => 'js'); 
} => 'test'; 

回答

4

你碰到了same-origin policy,它阻止(除其他外)XmlHttpRequest從遠程域獲取數據。您的POST 成功,但瀏覽器不會讓您得到迴應。

既然你要去一個遠程域,最好的辦法是support JSONP,它的工作方式不同,你不能POST,所以它會得到一個GET,但它會允許你獲取數據。 JSONP使用完全獲取數據的不同方法,基本上將您的回調定義爲名稱函數,然後在頁面中創建一個<script>標記。遠程服務器以namedFunction({ ...JSON data })響應,您的頁面運行時不需要XmlHttpRequest。

+0

提及SOP +1。 – 2010-09-02 12:15:29

0

jquery使用從帖子返回的數據來確定請求是否成功。如果情況並非如此,則會引發異常。

0

似乎並沒有被什麼不對您的客戶端代碼jsFiddle,不過,你可能想改變"{\"ipaddr\":\"192.168.132.58\"}"{ipaddr:"192.168.132.58"}因爲這將是一樣的發送了帶有值192.168.132.58命名爲ipaddr領域的形式,你自己的選擇是發送一個名爲{"ipaddr":"192.168.132.58"}的字段爲空值。

祝你好運。

+0

我需要發送json請求。如果我這樣做,你寫的我會POST請求是這樣的: IPADDR = 192.168.132.58 相反JSON格式(我真正需要的)的: {「IPADDR」:「192.168.132.58」} – dynax60 2010-09-02 10:04:33

0

嘗試並檢查您的服務器端輸出的隨機空白,這取決於瀏覽器可能會搞砸分析。

0

「就他們的意思而言 - 唯一真正的技術差異(如果我錯了,請更正此帖)是GET對查詢字符串的限制要短得多。實際上,GET意味着因爲從服務器獲取某些東西時,GET調用不應該對服務器造成副作用,POST是當你打算在服務器上發送一些東西並讓它對它做某些事情時。 (Difference between jquery.post and jquery.get?

你試過了$ .get()嗎?它應該是更快,更多用於從服務器返回數據...這裏是一些文檔:http://api.jquery.com/jQuery.get/

+0

獲取不使用json格式,即我不能以json格式發佈它。 – dynax60 2010-09-02 10:05:50