2010年06月07日

JavaScript:クロスドメインで動的にデータを取得

JavaScriptでクロスドメインで動的にデータを取得する方法。
scriptタグを動的に作って、そのsrc属性でcgiを指定する。
例えば郵便番号をパラメータで受け取って検索した住所をJavaScriptのコードで返すcgi作る。

http://どこかのサイト/郵便番号検索.php?郵便番号=1000001&コールバック関数=getAddr

<cgiの処理>
パラメータの郵便番号からデータベースを検索し住所を取得する。
取得した住所を受け取るコールバック関数を実行するJavaScriptを出力する。
//言葉にするとややこしいが出力するコードは単純
getAddr(["検索した住所"]); //コールバック関数に結果を渡す(複数返ることがあるので配列にする)

このcgiをsrc属性とするscriptタグを動的に作り、コールバック関数でcgiが生成した住所のパラメータを受け取る。

<サンプル>
緑里庵のサイトに郵便番号データベースから住所を取得するphpを設置し、それをJavaScriptで取得する。)

郵便番号を入力して検索ボタンを押してください。
郵便番号
住所

↑のソース(仕組みはsaadd.js参照)
<script type="text/javascript" src="http://www.ryokurian.jp/atelier/saadd/saadd.js" charset="utf-8"></script>
郵便番号を入力して検索ボタンを押してください。
郵便番号 <input type="text" size=8 length=8 id="postCD" />
<input type="button" onclick="_ryokurian_searchAddr(document.getElementById('postCD').value, 'addr');"
value="検索" class="input-submit" />
住所 <input type="text" id="addr" size=50 />


posted by 忘却の達人 at 06:31| Comment(0) | TrackBack(0) | JavaScript | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。