@blog.justoneplanet.info

■前置き

XMLHttpRequestを使って、他ドメインのサーバーと通信は出来ない。

どのようにすれば他サーバーからデーターを取得できるのか？

1. XMLHttpRequestで同ドメイン内の（PHPなどの）プロキシを使用し、プロキシが他のサーバーと通信する
2. scriptタグを書き換えて通信する
3. 隠しフレームを使う

今回は2番を使う。

■簡単な流れ

headタグ内にと空のスクリプトタグを記述

（スクリプト書き換え用）

<script type="text/javascript" charset="utf-8" id="import"></script>

データが戻ってきた場合の処理を定義

（下記はテスト用でアラート）

function callBackFunction(JSON){
    alert('test');
}

スクリプト要素の書き換え関数と書き換えるタイミングを定義

（下記はロード時に実行）

window.onload = function(){
    var originalScriptNode = document.getElementById('import');
    var newScriptNode = document.createElement('script');
    newScriptNode.src =  '/*ここにスクリプトのsrc属性値を記入（他ドメイン）*/';
    newScriptNode.charset = 'utf-8';
    newScriptNode.id = 'import';
    originalScriptNode.parentNode.replaceChild(newScriptNode, originalScriptNode);
}

上記スクリプトで入れ替えるJavaScriptにというように記述

（→このデータを受け取った瞬間にcallBackFunctionが実行される）

callBackFunction(/*引数*/);

つまり、scriptタグのsrc属性には他ドメインも可能という特性を利用している