Another requirement that I have is to put JSON content in the body of a POST request. I was able to get this to work properly by setting the params value like below for an Ext.ajax.Request. But when trying to define my proxy in the Ext.data.Store, there was not a params value available to use. I tried setting the extraParams to be Ext.JSON.encode(myJson), but when the request was submitted my body ended up with URL-encoded info like 0={&1="&2=n&3=a&4=m&5=e&6="&7=%3A&8="&9=C&10=a&11=t&12="&13=%2C&14="&15=o&16=b&17=s&18=o&19=l&20=e&21=t&22=e&23="&24=%3A&25="&26=N&27="&28=}
instead of the JSON object desired:
{"make":"BMW","model":"M5"}
Here's the code that ended up working for me to allow getting JSON content in the BODY of a POST request that my service requires. The undesireable part is that it doesn't work natively in Sencha Architect -- I am still manually copying the data over the top of the automatically generated file as I wasn't able to get the earlier suggestion of overriding initComponent() to work for me in the SA generated override file.
Code:
Ext.define('Cars.store.TestStore', {
extend: 'Ext.data.Store',
requires: [
'Cars.model.CarData'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
var myJson = { make:'BMW', model:'M5' };
var authorizationString = Base64.encode('username:password');
me.callParent([Ext.apply({
autoLoad: false,
storeId: 'TestStore',
model: 'Cars.model.CarData',
proxy: {
type: 'ajax',
noCache: false,
pageParam: '',
startParam: '',
limitParam: '',
url: 'http://localhost:7777/Cars/cars/create',
actionMethods: {
read: 'POST'
},
headers: {
'Content-Type':'application/json; charset=utf-8',
'Authorization': 'Basic ' + authorizationString
},
reader: {
type: 'json',
encodeRequest: true,
},
/*
* override Ext Ajax Proxy doRequest method
* must be maintained when Ext library is updated in the app
*/
doRequest: function(operation, callback, scope) {
var writer = this.getWriter(),
request = this.buildRequest(operation, callback, scope);
if (operation.allowWrite()) {
request = writer.write(request);
}
Ext.apply(request, {
headers : this.headers,
params : Ext.JSON.encode(myJson),
timeout : this.timeout,
scope : this,
callback : this.createRequestCallback(request, operation, callback, scope),
method : this.getMethod(request),
disableCaching: false // explicitly set it to false, ServerProxy handles caching
});
/*
* do anything needed with the request object
*/
console.log('request', request);
console.log('request.params', request.params);
Ext.Ajax.request(request);
return request;
}
}
}, cfg)]);
}
});