THE HAM MEDIA BLOG

JSONについての勉強メモ:クロスドメインでJSONデータを利用する

Clip to Evernote このエントリーをはてなブックマークに追加
カテゴリ:
jQuery
タグ:
JSON
javascript
jquery

クロスとメイン上のJSONデータを呼び出してみた

昨日までJSONデータの取り扱いで悩んでいたら、
なんと『to-R』の西畑さんが、参考となるエントリーを書いてくださいました!

参照:JSONとJSONP[to-R]

これを見たときは、大興奮(笑)
本当にありがとうございます。

読んでいるだけだとだめだ!なんて思ったので、
自分でも動作するかいろいろいじってみる事にした。

クロスとメイン上のJSONデータを呼び出してみた

■利用したコード

<script type="text/javascript" 
    src="https://h2ham.up.seesaa.net/json/sample.json"></script>
<script type="text/javascript">
$(function(){
    var getData = "";
    for(var i = 0 ; i < jsonData.users.length ; i++){
        getData += 
            "<p>名前は"+jsonData.users[i].name+"です。<br />";
        getData += 
            "歳は"+jsonData.users[i].age+"です。<br />";
        getData += 
            "言語は"+jsonData.users[i].language+"です。</p>";
    }
    $("div#testarea").html(getData);
});
</script>

データの読み込み方は西畑さんのを参考に、
コードは自分でいじってみました。

■プレビュー

ここにデータを読み込む

で、できたー!

クロスドメインで呼び出すことができました!

JSONPの勉強は

今回はJSONで呼び出す方法を勉強できました!

次はJSONPで呼び出すのを勉強してみようと思います。

トップ画のソース

some sunshine / 梅雨の晴れ間
Photographer
Kanko*
License
Creative Commons (by)
Tool for photo selecting
Gigazinize Tools - Image
参考サイト:
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

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


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

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

トップに戻る