Setting global default ajax timeout in sencha app

Most of the times we need to configure a timeout for all the ajax calls fired from anywhere in the sencha application. This can be done by simply setting up some properties for the Ext.Ajax, Ext.data.proxy and Ext.data.connection classes during application startup.

You may add a function setup to Application through Sencha Architect just to keep this code in a separate function (otherwise you may add the code to launch method as well. Below is the configuration required for setting global default ajax timeouts

Above code sets the timeout to 300000 ms and additionally disables the default xhr headers to false (disabling this might save you some time in case you face any issues when the headers provided to your ajax calls seems to be changed)

 

Edit 05-01-2017: For Extjs 6.2 just adding below to launch method should handle the default timeout for ajax in your application :

Ext.override(Ext.data.proxy.Ajax, {
timeout: 60000
});

 

5 thoughts on “Setting global default ajax timeout in sencha app”

  1. Adding this code in the launch function in my application didn’t help, I still see that my ajax call is being timedout at 30 seconds. Not sure why, any thoughts?

    1. Hi Srinivas,

      Can you give some more details about how are you making ajax calls?
      Actually I did it by adding this code to a another js file and imported that file as a js resource in my application. Configured cmd properties in Sencha Architect for this file as :
      bootstrap: true
      includeInBundle: true
      requireSdk : true

      I think the same result should be achieved by adding it to launch method as well, but haven’t tried it yet, will try to verify this one as well.

  2. We are migrating from Ext4.2.2 to Ext6.2.2. We initially had the below code in the launch function to increase the default timeout of 30 sec as shown below.
    launch : function() {
    Ext.override(Ext.data.proxy.Ajax, {
    timeout : 300000
    });
    ——
    ——-
    });

    After modifying the above code as below, I do not see any difference, all my AJAX calls defined in the proxies within the stores are still using the 30 second timeout period only.

    launch : function() {
    Ext.data.proxy.Server.override ({
    timeout: 300000
    });

    Ext.data.Connection.override({
    withCredentials: false,
    useDefaultXhrHeader: false,
    disableCaching:false,
    timeout: 300000
    });

    Ext.Ajax.setWithCredentials(false);
    Ext.Ajax.setUseDefaultXhrHeader(false);
    Ext.Ajax.setDisableCaching(false);
    Ext.Ajax.setTimeout(300000);
    ——
    ——-
    })

    NOTE: I am neither using Sencha Command to build our application nor using Sencha Architect.

      1. Hi,
        Thanks for the working fiddle. I am not building my application from Sencha Command. That could be the reason, it was not working with overriding in the launch function with this code “Ext.override(Ext.data.proxy.Server, { timeout:40000 });”

        If I override the same above the Ext.application line in my app.js, it is working.

        However, in the latest ExtJS 6.2.2 version, there is a bug that has been identified that is breaking this override.
        “Ext.override(Ext.data.proxy.Server, { timeout:40000 });”

        The Sencha support team had helped in raising a bug to fix this in their upcoming releases 🙂

        Thanks for the help.
        Srinivas

Leave a Reply

Your email address will not be published. Required fields are marked *