Manier 4: JSON

Jeej, Jason, nog een griek :-)

Bij deze methode gaat het erom dat je het antwoord als javascript-object (arrays en objecten zijn in Javascript heel erg vergelijkbaar) terugstuurt. Het voordeel is dat je het antwoord niet zelf meer hoeft te parsen.

Modernere browsers hebben inmiddels de functies JSON.parse & JSON.stringify om je responseText string om te zetten naar objecten.

Oudere browsers, zoals Firefox voor versie 3.5, en Internet Explorer, hebben die functies nog niet. Maar omdat JSON letterlijk Javascript is, kan je eval** gebruiken om hetzelfde te doen. Eval heeft wel één groot nadeel: het voert je code ook uit, dus ook de functieaanroepen die iemand kwaadwillend erin heeft gewerkt. Voorzichtigheid is dus geboden, al valt het in praktijk wel mee.

Omdat JSON inmiddels veel gebruikt wordt, heeft zo'n beetje iedere Javascript bibliotheken oplossingen voor het veilig parsen ingebouwd. jQuery heeft parseJSON, Prototype komt met evalJSON, Mootools JSON.decode.

Sinds PHP 5.2 heeft PHP zelf ook json_encode voor het vertalen van je array of object in een JSON. Kant en klaar. Uiteraard heb je dan ook json_decode, welke je in de praktijk eerder zal gebruiken om met webservices zoals Twitter API te praten wanneer je JSON in plaats van XML gebruikt als codering.

Voorbeeldje:

api.php:

Code (php)

1
2
3
4
5
6
7
8
9

<?php

$post = new stdClass();

$post->tags = array('json', 'tutorial', 'javascript');
$post->author = 'Jelmer';

echo json_encode($post);
?>

Code (php)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

function getPost()
{
   var request = createHTTPHandler();
   request.open('GET', 'api.php', true);
   request.onreadystatechange = function() {
      if(request.readyState == 4) {
         var post = parseGetPostResponse(request.responseText);
         // post is nu een eersteklas javascript object
         alert(post.author + ': ' + post.tags.join());
      }
   }
   request.send();
}

function parseGetPostResponse(json)
{
   // Eerst proberen of de browser JSON veilig kan parsen
   if(JSON && JSON.parse)
      return JSON.parse(json);
   // Zo niet, gebruik dan maar eval.
   else
      return eval('(' + json + ')');
}

« Lees de omschrijving en reacties