jQueryを使用してサブドメインからJSONを取得

Question

私はuser1.mydomain.comとuser2.mydomain.comのドメインを持っています。私はapi.mydomain.comを使って、AJAX/JSON上の私のWebアプリケーションを扱います。だから私はからapi.mydomain.com/projectsへのPOST要求を以下のようなjQUeryを使って作成したい：{'action':'getActiveProjects'}結果としてJSONのuser1のアクティブなプロジェクトのリストを取得する。私は$.getJSONメソッドを見つけましたが、サーバーにデータを送信するためのオプションがないようです。ちょうどGETメソッドです。私が直面しているもう一つの問題は、同じ起源政策です。だから、私は別のサブドメイン上のサーバーにいくつかのJSONをPOSTして、結果としてJSON応答を得ることができますか？

Answer 1

を指定して$.ajaxとJSON-Pを使用します。リンクされたドキュメントの詳細。あなたのサーバーはJSONだけでなくJSON-Pで応答する必要がありますが、サーバーを制御することは非常に簡単です。

また、最新のブラウザ（IEではなく）のみをサポートする必要がある場合は、CORSをサポートするようにサーバーを設定することができます。しかし、これは最近のブラウザでのみサポートされています。IE8はそれをサポートしていますが、通常のXMLHttpRequestオブジェクトを透過的にサポートしていませんが、jQueryが自動的に処理しない全く別のトランスポートオブジェクト（XDomainRequest） ）。ここで

はjQueryのを使用してJSON-Pの例です：サーバー上

$.ajax({ 
    // The source URL 
    url: "http://jsbin.com/ubucu4", 

    // Tell jQuery you're doing JSON-P 
    dataType: "jsonp", 

    // Include some data with the request if you like; 
    // this example doesn't actually *use* the data 
    data: {some: "data"}, 

    // You can control the name of the callback, but 
    // usually you don't want to and jQuery will handle 
    // it for you. I have to here because I'm doing this 
    // example on JSBin. 
    jsonpCallback: "exampleCallback", 

    // Success callback 
    success: function(data) { 
    display("Received data, typeof data = " + typeof data); 
    display("data.foo = " + data.foo); 
    display("data.bar = " + data.bar); 
    }, 

    // Error callback  
    error: function(jxhr, status, err) { 
    display("Error, status = " + status + ", err = " + err); 
    } 
}); 

Live copy

、あなたは、例えば、jQueryのURLにcallbackパラメータを追加していることがわかります上記の場合はhttp://jsbin.com/ubucu4?callback=exampleCallbackになりますが、jQueryの制御が好きな場合は、その名前がもう少しエキゾチックになります。サーバーサイドのコードは、JavaScript関数呼び出しである応答を作成し、その関数を呼び出す必要があります。上記の例では、私の応答がある：

exampleCallback({ 
    "foo": "This is foo", 
    "bar": "This is bar" 
}); 

この代わりSame Origin Policyを受けるXMLHttpRequestを使用する、JSON-Pは、（微細である）動的に追加scriptタグを使用しているため、すべてが起こります。私の例では、タグがあなたのJSON-P応答であるスクリプトを取得し、それを実行します

<script type='text/javascript' src='http://jsbin.com/ubucu4?callback=exampleCallback'></script> 

ブラウザのようになります。つまり、コールバックが呼び出され、データがスクリプトに渡されます。

あなたのJSON-Pレスポンスは、技術的にはJSONではありません。それはJavaScriptであり、その理由から、コードに直接ページに注入するので、あなたが信頼するサーバー（たとえば、自分のサブドメインサーバー）でJSON-Pを使用することが不可欠です。それ以外の場合、信頼できないサーバーを使用している場合、注入されたコードがページから情報を読み取り、それを第三者に送信する可能性があります。あなたの見出しに注意してください。

Answer 2

サブドメインは個別ドメインなので、Ajax/JSONを使用することはできません。 はですが、JSONPを使用してください。 jQueryにはこれが組み込まれているので、リクエストで指定する必要があります。関連するdocsを見てください。 JSONPでPOSTを使用することはできません（これはこの手法の仕方によって制限されます）が、ブラウザ間のクロスドメイン要求を行う方法は他にありません。

Answer 3

これは別の問題の正しい解決策であるメインドメインへdocument.domain

document.domain = "mydomain.com" 

More info here