Has anyone built a login widget?

01-13-2016 04:26 PM
Occasional Contributor

I have an app that is open to the public, but there is some additional data that requires a login.  Trying to find a good pattern on how to set up the security is difficult. 

Does OAuth using Active Directory work with the WAB?  Any other ideas of the best way to add a login?

Thanks, Chris

Tags (2)
0 Kudos
7 Replies
MVP Esteemed Contributor


   Normally you allow the Identity manager to handle the login for secure services. Are you wanting something different than that? If you want to bypass the login then you use a proxy to provide the credentials.

0 Kudos
Occasional Contributor


We have a Sign-In widget in WAB app which loads at the startup covering the app viewport. This widget ask for AGOL credentials and authenticate with the AGOL account that is set in the WAB configuration.


_signIn: function(userName, password) {

      if(!userName || !password) return;

      var serverInfo = new ServerInfo();

      serverInfo.server = this.appConfig.portalUrl;

      serverInfo.tokenServiceUrl = this.appConfig.portalUrl + "/sharing/rest/generateToken";

      var userInfo = {

        username: userName,

        password: password


      var def = window.esri.id.generateToken(serverInfo, userInfo);

     def.then( lang.hitch(this, this._signInComplete), lang.hitch(this, this._signInFailed));


The benefits of using this design is that the user, roles and groups can be easily managed on AGOL or AGS. And Sign-In UI can be styled as desired.

OAuth authentication can also be used but. We observed that OAuth authentication using IdentityManager does not provide much flexibility with the UI. Though IdentityManagerBase can be used to modify the style of the UI but it redirects to AGOL oauth, therefore the overlay effect is lost.


Occasional Contributor

That's awesome Girish!  Would you be able to provide some additional instructions on how to implement?

New Contributor III

This is really nice one Girish, Can you please provide the more information over the implementation over the application with the Widget.js and widget.html for the UI. As this will be more cool if it is implemented over the application load,

0 Kudos
Occasional Contributor

I was not really clear in what I wanted to do with the login.  What I really want is to log in to the app itself.  I have taken care of the secure layers with AGOL, but wanted to limit the users to the app.

So I changed the settings in IIS from anonymous Authorization  to Windows  Authorization. This way anyone in our network can get into the app without logging in, and they can get to it from home with their normal windows login.


0 Kudos
New Contributor III

If for example you want to get a WMS Map service using Portal and it's authenticated, portal internal proxy will not be able to open it, you have to tell Portal, My Organization > Edit Settings > Trusted Servers <server_hostname_without_protocol_with_port_number> click Save. Return to Map and when reading the WMS OGC he will prompt you for username and password accordingly. It's only an example, if it's not exactly what you need at least can give you some ways aswell.

0 Kudos
New Contributor III

I created Authentication in VS .net MVC framework. The login ware should be in the server side code, not client side.

Login account is stored in database. The account and password mapped with the record then pass the authorization. 

The login info saved in session. After passed then the page redirected to the GIS main page.

The video  mvc login video guide you how to build the login.