$.getとPHPでJSONデータを表示する（PHPのheaderとパース処理）

JSON形式データをPHPで取得したあと、そのデータをjQuery.getで取得してデータを表示するプログラムです。

test.json

JSON形式のデータです。

{"Country":"日本","Capital":"東京"}

json.php

test.jsonからデータをfile_get_contentsで取得してprintで出力しています。

$json = file_get_contents("http://localhost/test.json");
$json = mb_convert_encoding($json, 'UTF-8');
header('Content-type: application/json; charset=UTF-8');
print $json;

get.html

$.getでjson.phpの出力データを取得して、そのデータをdiv#contentに表示します。

json.phpに「header(‘Content-type: application/json; charset=UTF-8’);」を追加することによって、get.htmlの$.getで取得したデータをパース（JSON.parse）せずにそのまま処理します。

ということで、json.phpのheaderをコメントアウトした場合、get.htmlの$.getで取得したデータを処理するときは、パースすることで表示します。

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>
<script>
$(function() {
	$.get('json.php')
	.done(function(data) {
		//var data = JSON.parse(data);
		$.each(data, function(k, v) {
			$('#content').append('<p>' + k + ":" + v + '</p>');
		});
	});
});
</script>