Sencha Touch 之 Ajax

 一、请求方式Get、Post

Ext.Aiax.request({

     url:'myUrl',

     method:'POST',

     params:{

          username:'king',

          password:'king'

     },

     callback:function(response){

          console.log(response.responseText);

     }

});

请求自动地将param对象打包为form数据，是作为POST请求的一部分发送出去

Ext.Aiax.request({

     url:'myUrl',

     method:'GET',

     params:{

          username:'king',

          password:'king'

     },

     callback:function(response){

          console.log(response.responseText);

     }

});

当你发送一个GET请求时，许多web服务器将缓存一个应答，并总是将这个相同的应答发给你。这加快了web的速度，但有时这不总是我们想要的。

所以，我们要破坏这个cache，也只需加上一个时间戳就可以达到目的了。目的是告诉web服务器这次请求是新的，不要缓存请求

如果你想关闭这种处理，你只需设置disableCaching为false就可以了

Ext.Aiax.request({

     url:'myUrl',

     method:'GET',

     disableCaching:false,

     params:{

          username:'king',

          password:'king'

     },

     callback:function(response){

          console.log(response.responseText);

     }

});

  二、根据Header改变返回数据格式

web服务器可以根据Header头不同，回应JSON、XML、CVS数据

下面获取JSON数据

Ext.Aiax.request({

     url:'myUrl',

     method:'GET',

     headers:{"Content-type":"application/json"},

     params:{

          username:'king',

          password:'king'

     },

     callback:function(response){

          console.log(response.responseText);

     }

});

三、callback回调

当Ajax请求失败时，Ext.Ajax可以帮你指定所有场景下的callback回调函数

Ext.Ajax.request({

     url:'myUrl',

     success:function(response){

          console.log('请求成功');     

     },

     failure:function(response){

          console.log('请求失败');

     },

     callback:function(response){

          console.log('数据');

     }

});

当请求成功时，success函数首先会被调用，然后是callback函数。

当请求失败时，failure函数会被调用，然后是callback函数。

四、请求超时和中断

当后台服务器响应时间过长而导致请求超时时。failure函数将会被调用，该函数的传递参数request对象中，timeout的属性为true

Ext.Ajax.equest({

     url:'myUrl',

     failure:function(reqponse){

          console.log(reqponse.timeout);

     }

});

缺省情况下，timeout值为30秒，但是你可以通过timeout设置该值，该值单位是毫秒

var myRequest = Ext.Ajax.equest({

     url:'myUrl',

     timeout:5000,  // 5秒超时

     failure:function(reqponse){

          console.log(reqponse.timeout);

     }

});

Ext.Ajax.abort(myRequest);

上面代码中，超时处理函数将被调用，reqponse.aborted属性将设置为true。

Ext.Ajax.request({

     url:'myUrl',

     failure:function(reqponse){

          if(reqponse.timeout){

               alert('Timeout','服务器超时');

          }else if(reqponse.aborted){

               alert('Aborted','请求终止');

          }else{

               alert('Bad','请求失败');

          }

     }

});