jQueryを使ってPHPとJSON形式のデータをやり取りする方法

クライアントとサーバー間で通信するときにJSON形式のデータを簡単にやり取り出来ないものかと調査したメモ。

クライアント(JavaScript側)はjQueryとjQueryのプラグイン「jquery-json」を使う。ダウンロードはこちらから。

jquery-jsonはjson形式の変換(encode, decode)を簡単にできる。

サーバー側はjson_decodeとjson_encodeを使う。詳しくは前の記事を参照。

以下サンプル

クライアント側

var objData = new Object(); //var aData = {};でもOK
objData.name = "hoge"; //aData["name"] = "hoge"でもoK
objData.age = 12;
sJson = $.toJSON(objData);
$.getJSON("test.php", { json : sJson },
function(objRes){
    alert(objRes.country); //objRes["country"]でもok
});

(jquery-jsonを使わない場合はobjDataをpostする)

ちなみに$.post()を使って、$.evalJSON(res)してもいい。

サーバー側(test.php)

$objParam = json_decode($_POST['json']);
$objParam->country = 'japan'; //注意:配列ではない
echo json_encode($objParam);

試してないけど、こんな感じでできるはず。

POSTするとサーバー側のデバッグがしづらいので、サーバーにポストする前にalertでJSONを出力して次のようなHTMLを用意すれば、ちょっとやりやすくなる。

<html>
<head>
  <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'>
  <title>保存するときの文字コードを気を付ける</title>
</head>
<body>
  <form method="POST" action="test.php">
    <input type="text" name="json" value='ここにsJsonを貼り付ける'/>
    <input type="submit"/>
  </form>
</body>
</html>

文字コード(charset)はファイルの文字コードと合わせないと日本語が文字化けする。

 

<2010/01/25 追記>

magic_quotes_gpcがOnの場合はエスケープされてしまうので、Offにするかプログラム側で

if (get_magic_quotes_gpc()) {
    $json = stripslashes($json);
}

して実行する。

 

▼関連記事

【VB.NET】アプリケーションからJSON形式でサーバと通信する
【PHP】json_decode, json_encodeを使えるようにjsonをインストール