Tutorial: Cappuccino and JSONP

[Derek Kuhl]

Here's the code in PHP to implement a JSONP object. Note it's important to specify your file as javascript or you will get a successful JSONP connection and no data.

//We'll call this file jsonp.php
<?php
//Mandatory so that your JSONP information is seen by CPJSONPConnection protocol.
Header("content-type: application/x-javascript");

//This callback is called callbackName, but you can customize them for specific interactions.
if(isset($_GET['callbackName']))
{
$connection = $_GET['callbackName'];
$jsonMaker = array();
$jsonMaker['success'] = 1;
$jsonMaker['arrayOfStuff'] = array('one', 'two', 'three');

echo($connection.'(' . json_encode($jsonMaker) . ');');
}

//We won't do anything here, but you can see there are options to have different callbacks.
if(isset($_GET['otherCallback']))
{
$connection = $_GET['otherCallback'];

//Just showing that you can set parameters by addending "?&aSpecialParameter=neato"
//to the end of your URL, which can aid in debugging.
if($_GET['aSpecialParameter'] == "neato")
echo($_GET['aSpecialParameter'].'({});');
else
echo($connection.'({});');
}
?>


Now you have the server giving some data. In order to implement CPJSONConnection protocol, your object needs to support two methods:


- (void)connection:(CPJSONPConnection)aConnection didReceiveData:(CPString)data
{
//Since we're setting our callback to something specific, we can do something specific for this request
if(aConnection._callbackParameter == "callbackName")
{
alert("success!");
}
else
{
alert("Ruh roh, raggy, no callback.");
}
}

- (void)connection:(CPJSONPConnection)aConnection didFailWithError:(CPString)error
{
alert(error);
}


When you want to make a JSONP request:


//Normally this would be the URL of a different server, but it's just an example.
var request = [CPURLRequest requestWithURL:"json.php"];

var connectionCheck = [CPJSONPConnection connectionWithRequest:request callback:"callbackName" delegate:self];


This calls the json.php file and heads to "connection:didReceiveData:" protocol definition.

json.php output:
{"success":1,"arrayOfStuff":["one","two","three"]});

"connection:didReceiveData:" does the following:
an alert pops up telling you it's a success!