As discussed in Accessing Elance from AJAX, retrieving data from another site is restricted by the same origin policy, which restricts a Web page from accessing data outside of its own domain. This cross-site restriction does not apply to the HTML script tag, which can load Javascript files from any domain. A convention has evolved for JSON data that leverages this exception.

Using JSONP (short for "JSON with Padding"), an HTML client application can request that a REST API return its JSON data wrapped as a Javascript function call. The application defines this function within a page, and loads the API call as if it were an external Javascript file. When this file loads, it generates a callback against the defined function, with the JSON response data supplied as the function's sole argument.

Several of the Elance API methods support the jsonp query string parameter (check the documentation for details). Applications can use JSONP to load these Elance methods directly in a Web page, without the run-around of calling a PHP file or other server application on their host site. Assuming a client calls profile/getSearchThumbnail with a jsonp value of getSearchThumbnailCallback, the result looks like this:

  "api": "profile\/getSearchThumbnail",
  "apiVersion": 1,
  "rcode": 1,
  "data": {
    "thumbnailURL": "http:\/\/\/uploads2\/95\/57\/1732392

The following incomplete snippet demonstrates the use of JSONP with the search/jobs method. In the getSearchJobsPage() function, the client forms an Elance API call with the jsonp parameter set to searchJobsCallback. This callback is defined as a Javascript function further down in the sample. The loadElanceJSONPCall() adds this URL to a script tag and adds the tag to the document's header, causing the method call response to load as Javascript. When this file loads, it calls the searchJobsCallback() function, which receives the response data as a Javascript object.

var searchData = [];
function getSearchJobsPage(pageNum) {
	if (searchData[pageNum] == null) {
		var url = "" + 
		"8dfc476b57fee5b7dc08cc0f1d5a0fcdab409b3c&keywords=php%20mysql&" + 
		"sortCol=numProposals&sortOrder=asc&jsonp=searchJobsCallback&page=" + pageNum;
function loadElanceJSONPCall(url) {
   var e = document.createElement("script");
   e.src = url;
function searchJobsCallback(jsonCallbackData) {
	searchData[] = jsonCallbackData;
        // Process data.