Reply

REST Proxy using Sencha ExtJS

Employee
Employee
Posts: 65
4637     0

Hi REST Beta Users,

 

I thought I should share how I used the REST proxy in ExtJS 4 to connect to our REST API. Here is a code snippet where I got the connection setup.  It connects the network object in NIOS to a network model in ExtJS which can later be used for display or other purposes in a web brower.

Here is the code:

 

var store = Ext.create('Ext.data.Store', {
    autoLoad: true,
    autoSync: true,
    model: 'Network',
    proxy: {
        type: 'rest',
        url: '../wapi/v1.0/network',
        pageParam: undefined,
        startParam: undefined,
        limitParam: undefined,
        noCache: false,
        headers: {'Accept': 'application/json'},
        reader: {
            type: 'json',
            root: '',
            model: 'Network'           
        },
    }
});

Re: REST Proxy using Sencha

Adviser
Posts: 63
4638     0
Hi Andrew, thanks for sharing.I have a small question though, how do you handle authorization cleanly ? In the sample bellow I had to hardcode the HTTP Auth Basic Digest which is definitely not secure at all.Code :Ext.define('MyApp.model.IBHost', { extend:'Ext.data.Model', fields:[ { name:'name' } { name:'view' } ], proxy:{ pageParam: undefined, startParam: undefined, limitParam: undefined, noCache: false, type:'rest', url:'/wapi/v1.0/record:host', headers:{ 'Authorization':'Basic b64_digest_of_username_:_password' }, listeners:{ exception:function (proxy, response, operation) { alert(response); } } } });This allows me to manipulate host records without having to rely on a Store, but if a store is needed (for grids or extraParams) it could look like this :Ext.define('MyApp.store.IBHost', { extend:'Ext.data.Store', constructor:function (cfg) { var me = this; cfg = cfg || {}; me.callParent([Ext.apply({ autoSync:true, autoLoad:true, storeId:'IBHost', model:'MyApp.model.IBHost', }, cfg)]); }});Would you have any suggestions ?Thanks.

You have a few options. One

Community Manager
Community Manager
Posts: 248
4638     0

You have a few options. One is to add an additional layer of code that prompts the user for the authorisation credentials. and then just shove this onto a variable somewhere (at least it is only in memory then). something like this:

 

        buttons: [{
            text: 'Enter',
            handler: function() {


        IB.rest.auth = IB.data.Base64.encode(username + ':' + password);
        IB.rest.headers.Authorization = 'Basic ' + IB.rest.auth;

        Ext.override(IB.data.RestProxy, {
            //url: 'https://' + values.address + '/wapi/v1.0',
            headers: IB.rest.headers
        });

 

The other option (and i haven't tested this much with EXT) is to try and hook into the browsers basic auth:

var user = document.login.username.value;
var pass = document.login.password.value;

but you need to fire off some sort of request that forces the browser to kick you the auth panel. I don't know if Ext's implementation of AJAX will let you do this,

Thanks for the anwser ! At

Adviser
Posts: 63
4638     0

Thanks for the anwser ! At the end I decided to use a small backend library that acts as a proxy to the WAPI and allows me some flexibility on credentials checking.

Showing results for 
Search instead for 
Did you mean: 

Recommended for You