How to POST JSON request in cross domain in sencha touch - post

Question

I have got following URL
https://development.avalara.net/1.0/tax/get
and would like to POST following JSON request body
{
"DocDate": "2011-05-11",
"CustomerCode": "CUST1",
"Addresses":
[
{
"AddressCode": "1",
"Line1": "435 Ericksen Avenue Northeast",
"Line2": "#250",
"PostalCode": "98110"
}
]
}
which then will give JSON response
{
"DocCode": "78b28084-8d9a-477c-9f26-afab1c0c3877",
"DocDate": "2011-05-11",
"Timestamp": "2011-05-11 04:26:41",
"TotalAmount": 10,
"TotalDiscount": 0,
"TotalExemption": 0,
"TotalTaxable": 10,
"TotalTax": 0.86,
“TotalTaxCalculated”: 0.86,
"TaxDate": "2011-05-11",
.......
}
I have tried to use
Ext.Ajax.request
but get error
Origin http://localhost is not allowed by Access-Control-Allow-Origin.
which might be due to having different domain.
So, then i tried to use JSONP
Ext.data.JsonP.request
(
{
url: 'https://development.avalara.net/1.0/tax/get',
callbackName: 'test',
method: 'POST',
jsonData: '{"DocDate": "2011-05-11", "CustomerCode": "CUST1", "Addresses": [ { "AddressCode": "1", "Line1": "435 Ericksen Avenue Northeast","Line2": "#250", "PostalCode": "98110" } ] }' ,
success: function(response) {
//do some successful stuff
Ext.Msg.alert(response);
},
failure: function(response) {
//complain
Ext.Msg.alert('fail');
}
});
But URL 404(Not Found) error is encountered and request method is GET instead of POST.
Can anyone help me how POST request body(JSON) and obtaind JSON response from different domain?
Thanks in advance

Answer 1

You have four options:
Use CORS. development.avalara.net would need to setup CORS on the server and allow the domain that the Sencha page is running on.
Reverse Proxy requests through a server on the domain that the Sencha page is running on:
Sencha page (mydomain.com) ---> Web Server (mydomain.com) ---> development.avalara.net
Sencha page (mydomain.com) <--- Web Server (mydomain.com) <--- development.avalara.net
You could also POST the form as a regular form post action, or POST the form inside a hidden iframe.
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.Basic-cfg-standardSubmit
Run the Sencha app inside phonegap/cordova which does not block cross-domain requests.

Answer 2

You cannot do JSON-P with POST requests, JSON-P only supports GET requests. Your options are:
Use a GET request with JSON-P
Move the server functionality to the same server your ST app is running
Use something like Cordova and Whitelist the server you want to use for your AJAX POST requests, then use Ext.Ajax.request.