Build app with ExtJS and Spring - spring

Question

I am learning ExtJS framework, for experiments I use on front-end side ExtJS and on back-end side JavaEE Spring framework (it is configured like as REST service). So, I start my front-end part on localhost:1841 and back-end part on localhost:8080. Question is:
How I can say to ExtJS.Store that requests need to send to
localhost:8080/** instead of localhost:1841/**?
Sorry for my English!

Answer 1

In ExtJS have singleton you can use this class.
Singleton pattern is a design pattern which restricts instantiation of a class to only one object. This is useful when exactly one object is needed across the system. The Singleton pattern provides a single point of access to a particular instance. Implementation of a singleton pattern must satisfy the single instance and global access principles.
For this "How I can say to ExtJS.Store that requests need to send to localhost:8080/** instead of localhost:1841/**?"
You can use in your app like below code :
Firstly create singletone class
/*
* Create singletone class in your application
* This class you can access in your application anywhere you want within the app.
* Usage:
* commonUtility.getServerUrl();// whatever property you have defined inside of config you can access like this
*/
Ext.define('APPNAME.utils.SingleToneClassName', {
alternateClassName: 'commonUtility',
singleton: true,
config: {
/*
* you can put local or live also or whatever you want.
* for local it will be ip address like this {'http://192.168.30.83:8080/'}
* for live is will be live tomcate host url {http://example.com/}
*/
serverURL: 'http://192.168.30.83:8080/'
},
constructor: function(config) {
var me = this;
me.initConfig(config);
},
});
Create/Define your store
//Your store
Ext.define('APPNAME.store.StoreName', {
extend: 'Ext.data.Store',
fields: ['your fields here'],
storeId: 'storeIdHere',
alias: "store.storeAliasHere",
proxy: {
type: 'ajax',
url: commonUtility.getServerUrl() + 'your Server Method name here', //Based on your server URL acceptance
withCredentials: true,
reader: {
type: 'json',
rootProperty: 'data',
keepRawData: true
}
},
autoLoad: true, //If you need auto load then put true otherwise false
listeners: {
beforeload: function(store, operation, options) {
//If you have token based authenthication then you need to put like below
store.getProxy().setHeaders({
"x-auth-token": 'your token here'
});
//If you have need to pass some parameter in API method then you can pass like below
store.getProxy().extraParams.your_parameter_name = 'value';
}
},
});
//If you want to load your store on some event or any other functions
//then
Ext.getStore('your_storeId_herer').load({
url: commonUtility.getServerUrl() + 'your Server Method name here', //Based on your server URL acceptance
params: {
//If you have need to pass some params in server side then
//you put here like
name: 'value'
}
});
I hope this will help you. for more details you can refer ExtJS6.x Docs