2013年1月29日火曜日

IE7以前のブラウザでJSONを配列に分離する

Ajaxを使ったサイトでは、取得したデータを受け取るときにはJSON形式にして送信元に結果を返すことが多いと思います。
IE8以降や一般的なモダンブラウザならこれといった問題は生じないのですが。
このJSON形式を配列に分離する際に、IE7以前で分離できない問題にハマってしまいました。

問い合わせたJSONを配列にパースする


var obj = JSON.parse(responceText);

Ajaxで問い合わせて返却されたデータが、JSON形式にエンコードした状態でresponceText変数に格納されていると仮定します。
この記述は、IE8以上のIE、一般的なモダンブラウザ(Chrome/Firefox/Safari)で問題なくデータを配列に分離できました。

ところが、この記述はIE7以前ではJavascriptエラーとなってしまいます。
エラーコンソールによると、JSONに関するメソッドがそもそも実装されていない模様。
このままではせっかく返却されたデータを表示することができません。

IE7以前にはjson2.jsを使用する

IE7とJSON.parse()について検索をしていると、こちらのサイトに辿り着きました。

json2.jsのススメ
JSON.parse(); に渡す文字列に / (バックスラッシュ) が入っていたら SyntaxError に。

両者とも、JSONの分離にevalは使わない方がいいことを説明しているページのようです。
どちらにも登場するのがjson2.jsなのですが。
単純に解釈するなら、json2.jsはJSON.parse()メソッドを利用できないブラウザでJSON.parse()メソッドを利用できるようにするライブラリのようです。
このライブラリは、JSONを扱うページにインポートしておくだけで機能するようです。

<!--[if lte IE 7]>
<script src="json2.js" type="text/javascript"></script>
<![endif]-->

例では条件分岐コメントでIE7以前に適用できるようにしてます。
json2.jsはGitHubでシェアされているようなので、そちらからダウンロードして自分のサーバーにアップロードすることで使えました。

json2.jsダウンロード(GitHub)


0 件のコメント:

コメントを投稿