[JavaScript]JSONでのデータの受け渡し
今日は、開発ねたで。
Webアプリケーションの開発を行っていますが、当然のように最近流行のAjaxを使用しています。その中で簡単なものは、サーバーからHTML形式のデータを送信して指定された場所に表示するというコードを利用します。（データのやり取りには、prototype.jsを使用しています。日本語の解説は、こちら）
<div id="view"></div>
<script language="javascript" type="text/javascript">
<!--
function get_data()
{
var url = '/calc.html';
var post_params = 'a=10&b=20';
var ajax = new Ajax.Request( url, { method: 'post', postBody: post_params, onComplete: view_data} );
}
function view_data( res )
{
// エラー処理
// 結果の表示
document.getElementById( 'view' ).innerHTML = res.responseText;
}
//--> </script>
XMLでデータをやり取りするのが本来のAjaxのX部分なのですが、中身を加工するのにそれなりに面倒な処理を行う必要があります。
そこで簡単にデータのやり取りができるJSON (JavaScript Object Notation)という形式を用いて行うと簡単に受け取ったデータをJavaScript内でオブジェクトとして取り扱うことができるようになります。詳しい解説は、ググッてください。
簡単に説明すると
{
"name":"shima",
"age":"37"
}
}
というデータを返すようにサーバが実装されている場合にAjaxでデータを受け取ったあとで
alert( person.name ); // shimaが表示される
alert( person.age); // 37が表示される
という感じに簡単に受け取ったデータの操作ができるようになります。
ここで私がはまったのは、eval関数を使用するときに単純に
としたところきちんとオブジェクトにはなりませんでした。そこで受け取ったデータを『()』でくくるとうまくオブジェクトにすることができました。
eval関数を利用するときに注意しなければならないのは、受け取った文字列を単純にJavaScriptのソースとして評価してしまうので危険なデータがサーバーから送られてきた場合にセキュリティの問題が発生してしまいます。もし信頼の置けないような場合は、JSON parserを使用するなど安全には、注意してください。
ちなみにJSONは、RFC 4627として2006年7月に登録されています。
[追記 2006/10/26 15:01]
JSONでデータを渡すときの注意点ですが、オブジェクト同士を区切る「,」が一番最後のデータについているとevalで評価されずにオブジェクトにならないので気をつけてください。
| 固定リンク
コメント