JavaScriptでJSONPリクエストを使用してAjaxコールを実行するにはどうすればよいですか？

Question

純粋なJavaScriptを使用して別のドメイン（クロスドメイン）でajax呼び出しを行います。

データタイプを指定する必要があります。しかし、私は知らない、どこを指定する？。私はJavaScriptでAJAX呼び出しを行うために、次の使用

：

var xmlhttp = new XMLHttpRequest(); 
    var url = 'www.mydomain.com/path/to/reach'; 

    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == XMLHttpRequest.DONE) { 
      if (xmlhttp.status == 200) { 
       console.log('Log : ' + url + ' || Updated.'); 
      } 
      else if (xmlhttp.status == 400) { 
       alert('There was an error 400'); 
      } 
      else { 
       alert('something else other than 200 was returned'); 
      } 
     } 
    }; 

    url = url + '?callback=my_callback_method'; 

    xmlhttp.open("GET", url, true); 
    xmlhttp.send(); 

をまた、私はそれが動作しません、ダミーのコールバック、

function my_callback_method(res){ 
    // 
    } 

を作るしかし。 というエラーが表示される理由：CORSヘッダー 'Access-Control-Allow-Origin'にはがありません。

私のコードで何が問題になっていますか？

可能ですか？

すべてのソリューション？

（私はJavaScriptのみのためのソリューションを必要とする！）

Answer 1

私は理由として、エラーを取得する：CORSヘッダー「アクセス制御 - 許可 - 起源」 欠落しています。

あなたがXMLHttpRequestを使用しているためですとXMLHttpRequestの使用は、CORSを必要とします。 JSONP技術は、XMLHttpRequestの使用を伴いません。

var script = document.createElement('script'); 
script.src = '//domain.com/path/to/jsonp?callback=my_callback_method' 

document.getElementsByTagName('head')[0].appendChild(script); 

はまた、あなたがあなたのケースそのmy_callback_methodには、グローバル関数を作成する必要があり、JSONPスクリプトから呼び出し：JSONPでのトリックはscriptタグを作成し、ブラウザはそのスクリプトをロードできるようにすることです。

確かに、あなたは//domain.com/path/to/jsonpへの要求が得られた場合、それはcallback=my_callback_methodで指定されたグローバル関数を呼び出してjsのドキュメントを返すべきであると実装を持っている必要があり、サーバ側：

my_callback_method() 

Answer 2

私は最終的にjQueryのすべてのCORSリクエストに

Access-Control-Request-Headers: x-requested-with 

ヘッダを追加することを指摘し、このリンク"A CORS POST request works from plain javascript, but why not with jQuery?"につまずきました。 jQuery 1.5.2はこれをしません。また、同じ質問によると、サーバー応答ヘッダーを

Access-Control-Allow-Headers: * 

に設定しても応答を続行できません。レスポンスヘッダーに必要なヘッダーが含まれていることを確認する必要があります。すなわち：

Access-Control-Allow-Headers: x-requested-with