Web 2.0で変わるWebプログラミングの常識：Ajaxの真価はWebサービス連携にあり (4/4)

[大澤文孝，ITmedia]

var result = eval('(' + jsontext + ')');

　つまり、次のようにしてDOMを使い、HTMLコンテンツを書き換えられるのだ。

document.getElementById('addvalue').innerText = 
  result['add'];
document.getElementById('diffvalue').innerText = 
  result['diff'];

クライアントからサーバへJSONで送信する

　一般にクライアントからサーバーへとデータを送信する場合には、データをURLクエリ（GETメソッドの引数）として送る――すなわちREST形式にする――もしくは、データが大きかったりキャッシュが問題となったりする時には、POSTメソッドのボディ部として送信するというのがほとんどだ。送信データ形式としてJSONが使われることは少ない。

　これは呼び出しが簡単であり、サーバ側でのデータの受け取りも、通常のWebアプリケーションのように処理できるためだ（例えばPHPであれば、$_GETや$_POSTで取得できる）。

　しかしクライアントからサーバへと送信するデータをJSON形式にすることも可能だ。

　JavaScriptのオブジェクトをJSON形式に変換したいときには、「JSON in JavaScript」にあるライブラリを使えばよい（関連リンク）。

　これにより、サーバ側では適当なライブラリを使ってパースすることができる。例えば、今回説明しているJSON-PHPにはdecodeメソッドがあり、JSONデータをデコードできる。

　クライアント側からサーバ側への送信にJSONを使わなければならない場面は少ないと思われるが、可変長の配列をサーバ側へと送信したいといった場面では、JSON形式を用いると処理が容易になるだろう。

　今回の記事では、JSONについて解説してきた。Ajaxを効率的に利用するには、このようなライブラリが多数公開されているため、効果的に利用することが可能だ。一からすべてを開発するのもよいが、有志によって洗練されたライブラリを使ってみることで効率的なWebアプリケーション開発ができるはずだ。

共有する

プリント／アラート

オンラインムック Special

- PR -

Special

- PR -