Login Register

ScriptSrcIO

Due to security restrictions, XMLHttp cannot load data from another domain. The ScriptSrcIO transport is useful for doing this. Yahoo's RPC service is implemented using ScriptSrcIO.

To use ScriptSrcIO, use the following require statements

  • dojo.require("dojo.io.*");
  • dojo.require("dojo.io.ScriptSrcIO");

and use the normal dojo.io.bind() method.

To force a ScriptSrcTransport request, use transport: "ScriptSrcTransport" in the keyword arguments to dojo.io.bind(). The mimetype argument is also required.

Example:
dojo.require("dojo.io.*");
dojo.require("dojo.io.ScriptSrcIO");

dojo.io.bind({
    url: "http://example.com/json.php",
    transport: "ScriptSrcTransport",
    mimetype: “application/json",
    jsonParamName: "callback",
    content: { ... }
});

ScriptSrcIO (which provides ScriptSrcTransport) allows for four basic types of requests:

Each type uses [script src="url"][/script] to accomplish the request.

Here is a list of bind() keyword arguments that are supported for all types of requests. The four types of transport requests are:

Simple

Simply adds a script element with a src. Does not do any polling and does not expect a callback. Also does not support any timeouts. Example:

dojo.io.bind({
	url: "http://the.script.url/goes/here",
	transport: "ScriptSrcTransport",
	mimetype: “text/javascript"
});

Polling

Adds a script element with a src. It will poll to see if a typeof expression does not equal undefined. When the typeof check succeeds, a load callback is called. Timeout and error callbacks are supported with this type of request.

Example:

dojo.io.bind({
	url: "http://the.script.url/goes/here",
	transport: "ScriptSrcTransport",
	mimetype: "text/javascript",
	checkString: "foo", //This means (typeof(foo) != undefined) indicates that the script loaded.
	load: function(type, data, event, kwArgs) { /* type will be "load", data and event null, , and kwArgs are the keyword arguments used in the dojo.io.bind call. */ },
	error: function(type, data, event, kwArgs) { /* type will be "error", data and event will have the error, , and kwArgs are the keyword arguments used in the dojo.io.bind call. */ },
	timeout: function() { /* Called if there is a timeout */},
	timeoutSeconds: 10 //The number of seconds to wait until firing timeout callback in case of timeout.
});

JSONP and JSON Callbacks

Adds a script element with a src. This sort of usage allows using services that use the JSONP convention to specify the callback that the server will use.  Specify the name of the JSONP callback parameter using jsonParamName. Yahoo! Web Services use a jsonParamName of "callback". Some other services use jsonParamName of "jsonp". Timeouts are supported with this type of request. Example for a data service that uses "callback" as the URL parameter:

dojo.io.bind({
	url: "http://the.script.url/goes/here",
	transport: "ScriptSrcTransport",
	mimetype: "application/json",
	jsonParamName: "callback",
	load: function(type, data, event, kwArgs) { /* type will be "load", data will be response data,  event will null, and kwArgs are the keyword arguments used in the dojo.io.bind call. */ },
	error: function(type, data, event, kwArgs) { /* type will be "error", data will be response data,  event will null, and kwArgs are the keyword arguments used in the dojo.io.bind call. */ },
	timeout: function() { /* Called if there is a timeout */},
	timeoutSeconds: 10 //The number of seconds to wait until firing timeout callback in case of timeout.
});

Here is a real example of using JSONP to look up the del.icio.us bookmarks.

<style type="text/css">
.bookmarks {
  width: 300;
  background: lightGray;
  border-style: solid;
  border-width: 2px;
  border-color: black
}
</style>
<script type="text/javascript" src="dojo.js"></script>
<script type="text/javascript">
dojo.require("dojo.io.*"); 
dojo.require("dojo.io.ScriptSrcIO");

dojo.addOnLoad(getBookmarks);

function getBookmarks() {
    dojo.io.bind({ 
        url: "http://del.icio.us/feeds/json/dojomaster", 
        transport: "ScriptSrcTransport", 
        jsonParamName: "callback",
        load: function(type, data, event, kwArgs){showBookmarks(data);},
        mimetype: "application/json",
        timeout: function() {alert('timeout');},
        timeoutSeconds: 10
    });
}

// The code for showing the bookmarks is courtesy of del.icio.us
// http://del.icio.us/help/json
function showBookmarks(posts) {
     var ul = document.createElement('ul');
     for (var i=0, post; post = posts[i]; i++) {
         var li = document.createElement('li');
         var a = document.createElement('a');
         a.style.marginLeft = '20px';
         var img = document.createElement('img');
         img.style.position = 'absolute';
         img.style.display = 'none';
         img.height = img.width = 16;
         img.src = post.u.split('/').splice(0,3).join('/')+'/favicon.ico'
         img.onload = showImage(img);
         a.setAttribute('href', post.u);
         a.appendChild(document.createTextNode(post.d));
         li.appendChild(img);
         li.appendChild(a);
         ul.appendChild(li);
     }
     document.getElementById("container").appendChild(ul);
}
function showImage(img){ return (function(){ img.style.display='inline' }) }
</script>
<div id="container" class="bookmarks"></div>

To customize this scirpt simply change the URL http://del.icio.us/feeds/json/dojomaster to include your del.icio.us user name. This example shows the bookmarks for the user "dojomaster".

DSR/Multipart

Adds a script element with a src. Uses the Dynamic Script Request convention to specify the callback that the server will use. Multipart requests (splitting a long request across multiple GET requests) is supported. Timeout and error callbacks are supported with this type of request. Example:

dojo.io.bind({
	url: "http://the.script.url/goes/here",
	transport: "ScriptSrcTransport",
	mimetype: "application/json",
	useRequestId: true, //adds the _dsrId to request with a generated ID. If a specific request ID is wanted, use apiId: "myId" instead
	//optional: forceSingleRequest: true, //Will not segment the request to multipart requests even if it is a long URL.
	constantParams: "name1=value1&name2=value2" //params to be sent with each request that is part of a multipart request. See spec.
	load: function(type, data, event, kwArgs) { /* type will be "load", data will be response data, event will be onscriptload event, and kwArgs are the keyword arguments used in the dojo.io.bind call. */ },
	error: function(type, data, event, kwArgs) { /* type will be "error", data will be response data, event will be onscriptload event, and kwArgs are the keyword arguments used in the dojo.io.bind call. */ },
	timeout: function() { /* Called if there is a timeout */},
	timeoutSeconds: 10 //The number of seconds to wait until firing timeout callback in case of timeout.
});

Common bind() arguments

ScriptSrcTransport supports the following arguments across all types of requests. In general, all of these arguments have the same meaning and use in XMLHTTPTransport.

  • mimetype: REQUIRED. Tells ScriptSrcTransport how to deal with the response. The only allowed values are "text/javascript", "text/json" or "application/json".
  • transport: RECOMMENDED. Tells dojo.io.bind() which transport you want to use. If you do not specify this transport, there is a chance that the XMLHTTPTransport might try to handle the request.
  • formNode: Uses a form to generate query parameters.
  • backButton, back, forward, forwardButton, changeUrl: used to register a back/forward handler. See dojo.undo.browser for more info.
  • content: a JS object that gets turned into query parameters.
  • postContent: Adds raw name=value parameters to query parameters.
  • sendTransport: Adds dojo.transport=scriptsrc to query parameters.
  • preventCache: Adds dojo.preventCache=[unique ID] to bypass browser cache and force a fresh GET.
  • handle: A function that accepts the following arguments: function(type, data, event) {}. This can be used instead of specifying a separate load, error and timeout handler. The type parameter will be a string that specifies the callback type ("load", "error", "timeout").