読者です 読者をやめる 読者になる 読者になる

kur.jp

バイオリンと自転車をこよなく愛するkurのチラシの裏。たまには技術的なことを書いたりするかも知れません。

JavaScriptでJSON使ってクロスドメイン通信

正直に言おう.実は,この記事を書いたときにはJSON?なにそれ?めんどくせー.と思っていた.でも,PHPでJSONを扱うを読んで実際に使ってみると意外と簡単だし,便利っていうことがわかった.食わず嫌い,良くないですね.

めんどくさいと思っていた理由はいくつかあるんだけど,一番大きい理由は私がJSONと言うフォーマットについて良く知らなかったって言うことだと思う.JSONのフォーマットってのはwikipediaのJavaScript Object Notationの項目を見てもらうのがわかりやすいかなと思うんだけど,私がこれを見て初めに思ったことは,処理するのめんどくさそう.っていうこと.つまり,これってジェネレタとパーサを自分で書かなきゃいけないって思い込んでた.だけど,それは勘違いみたいでした.

まず,PHP(5.2.0以上?)で,JSONデータを表示するときは,これだけで出来る.

$values = array('id' => '103', 'data' => 'XXXX'); $json = json_encode($values); echo $json;

このとき,json_encode関数には引数として配列を与えているんだけど,試してみたら,配列じゃなくても大丈夫だし,多次元配列でも何の問題もなかった.ただし,注意しなければいけないのは文字コード.最初,Shift-Jisでコードを書いていたため,マルチバイト文字が出力されなかった.これに関してはUTF-8で出力すれば問題はないはず.

次に,JavaScript側で,JSONデータを受け取る処理.

$.getJSON("http://example.com",function(data){ console.log("JSON Data: " + data); });

URLはダミーだけど,こんな感じの処理を書くだけで,JSONのデータを受け取ることができる.ただし,当然のごとくgetJSONでサーバに対してリクエストを出した後は,ブラウザはすぐに,次のコードを実行する.で,JSONデータを受け取った後で,コールバック関数の中身を実行する.このため,JSONでデータを取得して,何らかの処理を行う場合には,注意が必要だと思う.

あと,問題はエラーの場合の処理.

通常は,データを受信して,解釈した上でコールバック関数を呼び出してくれるので問題がないんだけど,JSONが解釈できない場合は,ResponseTextに0が入った状態でコールバック関数を呼び出してくれる.これならまだJSONを受信できたかどうか判断可能なのでまだ良いんだけど,404エラー等が出てしまった場合,コールバック関数すら呼び出してくれない.一応,XMLHttpRequestのstatusプロパティには404が入っているので,getJSON関数を使ったあとは定期的にチェックした方が良いんだろうか?とりあえず,何らかのエラー処理は必要になりそう.