ExtJS 4 Application Login & Authentification & Rights

问题

I'm developing an web application on Ext JS 4 using the new recommended application structure. Therefore I need to implement a authentification & rights system. The idea so far:

1. The server is responsible to ensure the user role and rights.
2. ExtJS frontend has to change according to the permissions and role
3. I use a card layout. The first tab is the login screen, the second the application
4. In my controller I check if the user is logged in. If he has a valid identity I switch to tab 2. If not he is thrown back to tab 1.

My problem now is that I'm unsure about part 2 and part 4? How would you implement these two?

回答1:

• Once the user is authenticated bring the config options over from the server into a store. For example: Ext.StoreManager.get('ConfigOptionStore').loadData(/* config data returned from server */);

• Use the beforeRender event to add components to your current view (do this in the controller), like so:

  init: function() {
      this.control({
          'myPanel': {
              beforerender: function(cmp, eOpts){
              //place the store in a var for easy access
              var myConfigStore = Ext.StoreManager.get('ActiveUserStore').getAt(0);
  
              //from here you can use add() to add stuff like so:
              if (myConfigStore.get('hasMyButton')) {
                  cmp.add({
                      xtype: 'button',
                      text: 'My Button',
                      action: 'doSomething'
                  });
               }
               //etc...
           }
       });
  }
  

• Make sure that at any given time, you update the first record of the store with the current config options (when you loadData, load just one record).

• This should get you started in the right direction. Just be sure to create your initial views with the only the most basic components, and then add the custom components based on the user's config.

回答2:

You could send unique user "config" file from server depending on user id, so every user has its own config set up the way he wants, also you could use StateManager to save user config after has been changed. This way frontend will change according to the permission and role. For the part 4. i dont see any problem, if you decide to go with card layout...

setActiveTab( String/Number/Ext.Component card )

EDIT:

You can use getState(); from the Ext.AbstractComponent to retrive the "states", and save, so on the next load this state is initialized.This is not depending on Cookie or Local storage, so it will not expire. You can give user a chance to save state after he is finished with customizing Views.

来源：https://stackoverflow.com/questions/7633309/extjs-4-application-login-authentification-rights