Extjs to call a RESTful webservice

Question

Hello,

I am trying to make a RESTful webservice call using Extjs. Below is the code i am using:

Ext.Ajax.request({ url: incomingURL ,
   method: 'POST',
   params: {param1:p1, param2:p2},
   success: function(responseObject){
     var obj = Ext.decode(responseObject.responseText);
     alert(obj);
   },
   failure: function(responseObject){
     var obj = Ext.decode(responseObject.responseText);
     alert(obj);
   }
});

but it does not work, the request is sent using OPTIONS method instead of POST.

I also tried to do the same thing using below code but result is the same:

var conn = new Ext.data.Connection();
conn.request({
  url: incomingURL,
  method: 'POST',
  params: {param1:p1, param2:p2},
  success: function(responseObject) 
  {
    Ext.Msg.alert('Status', 'success');
  },
  failure: function(responseObject) 
  {
    Ext.Msg.alert('Status', 'Failure');
  }
});

But when i tried to do the same thing using basic ajax call ( using the browser objects directly i.e. XMLHttpRequest() or ActiveXObject("Microsoft.XMLHTTP")) it works fine and i get the response as expected.

Can anyone please help me, as i am not able to understand what i am doing wrong with extjs ajax call?

Answer 1

You can't make a standard AJAX call between domains. The URL for Ext.Ajax.request should be a relative one (relative to the script's origin).

If you want to do cross-domain calls, use a ScriptTagProxy or such.

Answer 2

I think this will explain what you're seeing: https://developer.mozilla.org/En/HTTP_access_control

See the part on preflighting requests.