PHPでJsonデータを作成する方法
JSONは、PHPでのデータのやり取りに使用されます。どのようにphpでjson形式のデータを作成し、それをJavaScriptなどに渡すのでしょうか。
目標
本記事の目標は、PHPで配列からJsonデータを生成し、JavaScriptで受け取ることです。これは、例えば、サーバからPHPでデータを取得して、JavaScriptで処理する場合などに使用できます。
方法
1. 入れ子のarrayを作成する
以下のようなサンプルデータを作成しました。
<?php $teachers = [] $teachers = [ "101" => [ "name" => "Poppins", "class" => "music", ], "102" => [ "name" => "Dolittle", "class" => "natural history", ], "103" => [ "name" => "Snape", "class" => "pharmacy", ], ]; ?>
forループを使って同じデータ構造を生成する場合は、以下のようになります。
<?php $teachers = []; $data_set = [["101", "Poppins", "music"],["102", "Dolittle", "natural history"],["103", "Snape", "pharmacy"]]; for($i=0; $i < count($data_set); $i++){ $teacher = $teachers_list[$i]; $teachers += array($teacher[0] => array("name" => $teacher[1], "class" => $teacher[2])); } ?>
2. json_encode()関数を使って、Jsonに変換する
<?php echo json_encode($teachers); ?> //output => {"101":{"name":"Poppins","class":"music"},"102":{"name":"Dolittle","class":"natural history"},"103":{"name":"Snape","class":"pharmacy"}}
3. JavaScriptでデータを受け取る
Json形式の文字列をphpの変数$teachersから受け取り、この文字列をJSON.parse()を使ってObjectに変換します。
<script type="text/javascript"> var json_str='<?php echo json_encode($teachers); ?>'; var json_obj = JSON.parse(json_str); console.log(json_str) for(k in json_obj){ // get keys var teacher = json_obj[k]; console.log("name: " + teacher['name']); console.log("class: " + teacher['class']); } /* --console output-- name: Poppins class: music name: Dolittle class: natural history name: Snape class: pharmacy */ </script>
ソースコード
ソースコード全体は以下のようになります。
<?php $teachers = []; $teachers = [ "101" => [ "name" => "Poppins", "class" => "music", ], "102" => [ "name" => "Dolittle", "class" => "natural history", ], "103" => [ "name" => "Snape", "class" => "pharmacy", ], ]; ?> <script type="text/javascript"> var json_str='<?php echo json_encode($teachers); ?>'; var json_obj = JSON.parse(json_str); console.log(json_str) for(i in json_obj){ var teacher = json_obj[i]; console.log("name: " + teacher['name']); console.log("class: " + teacher['class']); } </script>