docs/source/JsonP.html

   1 <!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-data.JsonP'>/**
   2 </span> * @class Ext.data.JsonP
   3  * @singleton
   4  * This class is used to create JSONP requests. JSONP is a mechanism that allows for making
   5  * requests for data cross domain. More information is available here:
   6  * http://en.wikipedia.org/wiki/JSONP
   7  */
   8 Ext.define('Ext.data.JsonP', {
   9
  10     /* Begin Definitions */
  11
  12     singleton: true,
  13
  14     statics: {
  15         requestCount: 0,
  16         requests: {}
  17     },
  18
  19     /* End Definitions */
  20
  21 <span id='Ext-data.JsonP-property-timeout'>    /**
  22 </span>     * @property timeout
  23      * @type Number
  24      * A default timeout for any JsonP requests. If the request has not completed in this time the
  25      * failure callback will be fired. The timeout is in ms. Defaults to &lt;tt&gt;30000&lt;/tt&gt;.
  26      */
  27     timeout: 30000,
  28
  29 <span id='Ext-data.JsonP-property-disableCaching'>    /**
  30 </span>     * @property disableCaching
  31      * @type Boolean
  32      * True to add a unique cache-buster param to requests. Defaults to &lt;tt&gt;true&lt;/tt&gt;.
  33      */
  34     disableCaching: true,
  35
  36 <span id='Ext-data.JsonP-property-disableCachingParam'>    /**
  37 </span>     * @property disableCachingParam
  38      * @type String
  39      * Change the parameter which is sent went disabling caching through a cache buster. Defaults to &lt;tt&gt;'_dc'&lt;/tt&gt;.
  40      */
  41     disableCachingParam: '_dc',
  42
  43 <span id='Ext-data.JsonP-property-callbackKey'>    /**
  44 </span>     * @property callbackKey
  45      * @type String
  46      * Specifies the GET parameter that will be sent to the server containing the function name to be executed when
  47      * the request completes. Defaults to &lt;tt&gt;callback&lt;/tt&gt;. Thus, a common request will be in the form of
  48      * url?callback=Ext.data.JsonP.callback1
  49      */
  50     callbackKey: 'callback',
  51
  52 <span id='Ext-data.JsonP-method-request'>    /**
  53 </span>     * Makes a JSONP request.
  54      * @param {Object} options An object which may contain the following properties. Note that options will
  55      * take priority over any defaults that are specified in the class.
  56      * &lt;ul&gt;
  57      * &lt;li&gt;&lt;b&gt;url&lt;/b&gt; : String &lt;div class=&quot;sub-desc&quot;&gt;The URL to request.&lt;/div&gt;&lt;/li&gt;
  58      * &lt;li&gt;&lt;b&gt;params&lt;/b&gt; : Object (Optional)&lt;div class=&quot;sub-desc&quot;&gt;An object containing a series of
  59      * key value pairs that will be sent along with the request.&lt;/div&gt;&lt;/li&gt;
  60      * &lt;li&gt;&lt;b&gt;timeout&lt;/b&gt; : Number (Optional) &lt;div class=&quot;sub-desc&quot;&gt;See {@link #timeout}&lt;/div&gt;&lt;/li&gt;
  61      * &lt;li&gt;&lt;b&gt;callbackKey&lt;/b&gt; : String (Optional) &lt;div class=&quot;sub-desc&quot;&gt;See {@link #callbackKey}&lt;/div&gt;&lt;/li&gt;
  62      * &lt;li&gt;&lt;b&gt;disableCaching&lt;/b&gt; : Boolean (Optional) &lt;div class=&quot;sub-desc&quot;&gt;See {@link #disableCaching}&lt;/div&gt;&lt;/li&gt;
  63      * &lt;li&gt;&lt;b&gt;disableCachingParam&lt;/b&gt; : String (Optional) &lt;div class=&quot;sub-desc&quot;&gt;See {@link #disableCachingParam}&lt;/div&gt;&lt;/li&gt;
  64      * &lt;li&gt;&lt;b&gt;success&lt;/b&gt; : Function (Optional) &lt;div class=&quot;sub-desc&quot;&gt;A function to execute if the request succeeds.&lt;/div&gt;&lt;/li&gt;
  65      * &lt;li&gt;&lt;b&gt;failure&lt;/b&gt; : Function (Optional) &lt;div class=&quot;sub-desc&quot;&gt;A function to execute if the request fails.&lt;/div&gt;&lt;/li&gt;
  66      * &lt;li&gt;&lt;b&gt;callback&lt;/b&gt; : Function (Optional) &lt;div class=&quot;sub-desc&quot;&gt;A function to execute when the request
  67      * completes, whether it is a success or failure.&lt;/div&gt;&lt;/li&gt;
  68      * &lt;li&gt;&lt;b&gt;scope&lt;/b&gt; : Object (Optional)&lt;div class=&quot;sub-desc&quot;&gt;The scope in
  69      * which to execute the callbacks: The &quot;this&quot; object for the callback function. Defaults to the browser window.&lt;/div&gt;&lt;/li&gt;
  70      * &lt;/ul&gt;
  71      * @return {Object} request An object containing the request details.
  72      */
  73     request: function(options){
  74         options = Ext.apply({}, options);
  75
  76         //&lt;debug&gt;
  77         if (!options.url) {
  78             Ext.Error.raise('A url must be specified for a JSONP request.');
  79         }
  80         //&lt;/debug&gt;
  81
  82         var me = this,
  83             disableCaching = Ext.isDefined(options.disableCaching) ? options.disableCaching : me.disableCaching,
  84             cacheParam = options.disableCachingParam || me.disableCachingParam,
  85             id = ++me.statics().requestCount,
  86             callbackName = 'callback' + id,
  87             callbackKey = options.callbackKey || me.callbackKey,
  88             timeout = Ext.isDefined(options.timeout) ? options.timeout : me.timeout,
  89             params = Ext.apply({}, options.params),
  90             url = options.url,
  91             request,
  92             script;
  93
  94         params[callbackKey] = 'Ext.data.JsonP.' + callbackName;
  95         if (disableCaching) {
  96             params[cacheParam] = new Date().getTime();
  97         }
  98
  99         script = me.createScript(url, params);
 100
 101         me.statics().requests[id] = request = {
 102             url: url,
 103             params: params,
 104             script: script,
 105             id: id,
 106             scope: options.scope,
 107             success: options.success,
 108             failure: options.failure,
 109             callback: options.callback,
 110             callbackName: callbackName
 111         };
 112
 113         if (timeout &gt; 0) {
 114             request.timeout = setTimeout(Ext.bind(me.handleTimeout, me, [request]), timeout);
 115         }
 116
 117         me.setupErrorHandling(request);
 118         me[callbackName] = Ext.bind(me.handleResponse, me, [request], true);
 119         Ext.getHead().appendChild(script);
 120         return request;
 121     },
 122
 123 <span id='Ext-data.JsonP-method-abort'>    /**
 124 </span>     * Abort a request. If the request parameter is not specified all open requests will
 125      * be aborted.
 126      * @param {Object/String} request (Optional) The request to abort
 127      */
 128     abort: function(request){
 129         var requests = this.statics().requests,
 130             key;
 131
 132         if (request) {
 133             if (!request.id) {
 134                 request = requests[request];
 135             }
 136             this.abort(request);
 137         } else {
 138             for (key in requests) {
 139                 if (requests.hasOwnProperty(key)) {
 140                     this.abort(requests[key]);
 141                 }
 142             }
 143         }
 144     },
 145
 146 <span id='Ext-data.JsonP-method-setupErrorHandling'>    /**
 147 </span>     * Sets up error handling for the script
 148      * @private
 149      * @param {Object} request The request
 150      */
 151     setupErrorHandling: function(request){
 152         request.script.onerror = Ext.bind(this.handleError, this, [request]);
 153     },
 154
 155 <span id='Ext-data.JsonP-method-handleAbort'>    /**
 156 </span>     * Handles any aborts when loading the script
 157      * @private
 158      * @param {Object} request The request
 159      */
 160     handleAbort: function(request){
 161         request.errorType = 'abort';
 162         this.handleResponse(null, request);
 163     },
 164
 165 <span id='Ext-data.JsonP-method-handleError'>    /**
 166 </span>     * Handles any script errors when loading the script
 167      * @private
 168      * @param {Object} request The request
 169      */
 170     handleError: function(request){
 171         request.errorType = 'error';
 172         this.handleResponse(null, request);
 173     },
 174
 175 <span id='Ext-data.JsonP-method-cleanupErrorHandling'>    /**
 176 </span>     * Cleans up anu script handling errors
 177      * @private
 178      * @param {Object} request The request
 179      */
 180     cleanupErrorHandling: function(request){
 181         request.script.onerror = null;
 182     },
 183
 184 <span id='Ext-data.JsonP-method-handleTimeout'>    /**
 185 </span>     * Handle any script timeouts
 186      * @private
 187      * @param {Object} request The request
 188      */
 189     handleTimeout: function(request){
 190         request.errorType = 'timeout';
 191         this.handleResponse(null, request);
 192     },
 193
 194 <span id='Ext-data.JsonP-method-handleResponse'>    /**
 195 </span>     * Handle a successful response
 196      * @private
 197      * @param {Object} result The result from the request
 198      * @param {Object} request The request
 199      */
 200     handleResponse: function(result, request){
 201
 202         var success = true;
 203
 204         if (request.timeout) {
 205             clearTimeout(request.timeout);
 206         }
 207         delete this[request.callbackName];
 208         delete this.statics()[request.id];
 209         this.cleanupErrorHandling(request);
 210         Ext.fly(request.script).remove();
 211
 212         if (request.errorType) {
 213             success = false;
 214             Ext.callback(request.failure, request.scope, [request.errorType]);
 215         } else {
 216             Ext.callback(request.success, request.scope, [result]);
 217         }
 218         Ext.callback(request.callback, request.scope, [success, result, request.errorType]);
 219     },
 220
 221 <span id='Ext-data.JsonP-method-createScript'>    /**
 222 </span>     * Create the script tag
 223      * @private
 224      * @param {String} url The url of the request
 225      * @param {Object} params Any extra params to be sent
 226      */
 227     createScript: function(url, params) {
 228         var script = document.createElement('script');
 229         script.setAttribute(&quot;src&quot;, Ext.urlAppend(url, Ext.Object.toQueryString(params)));
 230         script.setAttribute(&quot;async&quot;, true);
 231         script.setAttribute(&quot;type&quot;, &quot;text/javascript&quot;);
 232         return script;
 233     }
 234 });
 235 </pre></pre></body></html>