ArcGIS Online sign in issues with Custom Web AppBuilder apps

602
12
12-09-2019 01:50 PM
AdrianWelsh
MVP Notable Contributor

I hope this is a simple issue and something I'm just ignorantly missing.

I have a feature service and a web map that are both only accessible to people who belong to an ArcGIS Online‌ group in my organization (and members of my org). When they're logged in, they can see these things easily without the site asking for a login each time (as well as a dashboard).

I have made a custom WAB app through Web AppBuilder for ArcGIS‌ Developer edition (2.14) and am hosting it on my company's website. Each time I access this map link, even if I'm logged into ArcGIS Online, it makes me login again, but in a less friendly way:

Am I doing something wrong with the permissions? How can I skip this and make it easier to login?

I'm using the Dev edition in order to utilize Web AppBuilder Custom Widgets‌.

Tagging Kelly Gerrow

0 Kudos
12 Replies
KellyGerrow
Esri Frequent Contributor

Is the web map and layer shared with everyone?

0 Kudos
AdrianWelsh
MVP Notable Contributor

Hi Kelly,

Thanks for replying. The map and layer are both shared in my own org and with the group. It's the group access that is the most important as it's how the external people can see it. I can invite you to the group if that helps (the data is sensitive but only to the people that live in the immediate area).

0 Kudos
MichaelBoyce
Esri Contributor

Hi Adrian,

I have encountered an issue like this before on a clients site.
In that instance the problem was a cross domain issue, where (due to the...interesting nature of the deployment) the user would be asked to log in again to view some items.  That issue was resolved by simplifying the deployment and removing some of the proxy servers that were in the way.


As a test I would publish some Dummy Data in ArcGIS Online and host that in the app, but publicly share the Dummy Data and remove the sensitive data.  If a login is still required then the issue is likely to be something like the one I encountered.  In which case, it might be a good idea to sit down with the IT department/Web hosting department to see what the environment looks like and how to resolve the issue.
If the app loads fine and does not trigger a log in request, then looking at how the data is accessed from the app, if the custom widget is requesting a token correctly and if your firewall is letting the token request go through might be the path to go down.

I hope this helps

AdrianWelsh
MVP Notable Contributor

Hi Michael,

Thanks for the suggestions. I made the map public and kept the feature layer private and got a new login message:

This time it specifies "(item)". I know that more testing is involved but maybe this moves me in the right direction. I still wonder if I am not publishing something correctly on my website from WAB. I feel like I know if I publish this web map as a hosted WAB (not developer edition) that it will work just fine so this login thing must be coming from the web map being hosted on my company's website (which doesn't make it easy to test).

I wish we had an IT department or someone with server knowledge where I work... We're too small of a company for that I guess so it's fully up to me.

I just find it weird that if I'm logged into AGOL, click on an external link that opens an AGOL web map with this service, that I'm not prompted to log in (since I'm already logged in). But when clicking on the service that opens the map from my company site, it prompts me again (and does not allow for an easy way of having the browser remember my login in order for a swifter login and reducing stress and complications from outside users).

I will test it more.

Thanks,

Adrian

0 Kudos
AdrianWelsh
MVP Notable Contributor

Michael,

Ok, I made a hosted WAB app in my AGOL account and had no issues as I suspected. Can you tell me more about removing proxy servers or know if a token is being requested correctly or not?

Thanks!

0 Kudos
MichaelBoyce
Esri Contributor

Hi Adrian,

Nice detective work btw.

To recap (please let me know if this is correct):

  • The Web App is hosted on your site
  • The data is hosted in AGOL
  • The Web App is not registered with AGOL 

Ok, if the above is correct I think that I can see where things are going wrong.

After talking with a college of mine (thanks Nic Everdell)  to confirm a good course of action, here is what we suggest.

The reason that you are being asked to log in again is because the Web App does not have permissions to access the data, you might, but the app doesn't (not a proxy issue as I first thought).  To get around this here is what to do:

Now you will still have to be logged into AGOL to view the app.  If you are already logged in it should be fine, if not then it will ask you to log in, but in a nicer way.

Let me know if you need any more info and I will see what I can do.

All the best,

Michael

AdrianWelsh
MVP Notable Contributor

Michael,

I greatly appreciate your help. I'm now curious about testing proxy stuff, haha!

So, I attempted to try all the steps you listed. It was complicated and I likely got lost. Let me try to reiterate some details and how this 'worked'.

So, I have an organizational AGOL account where I published my data (from ArcGIS Pro) as a feature service (made it viewable to a group) and then made a web map out of it.

I downloaded and installed WAB developer edition on my local PC to create a WAB app from this web map, and added a widget, etc.

From the WAB screen on my local PC where I have my projects, I downloaded the app I wanted, as a zip file, and then extracted that zip onto my company's website, which has an easy-ish URL, etc.

When I open that URL, (since I have made the 'map' public) the map opens for a second, then prompts me for that username as I have shown above.

Now, I am trying to walk through the steps you listed and not sure I'm doing it right and not sure I have all the right criteria. 

On the "deploy your WAB project to AGOL" site, I exported my project as a template to my org, gave it title, tags, license, etc., then made a new group (do I need to make a new one?), and put that exported item into the group. I then choose this group to be the configurable app group in the settings.

What I don't understand is this part at the end of the page:

"Test your template in the Map Viewer by creating an application with this configurable template.

But wasn't sure it was relevant so I kind of ignored it (but I did go into one of my existing web maps and saw that I can "create a new web app" and can choose this 'template' as my app, so maybe it somewhat worked?)

Ok, assuming that's all correct, here is the next step: "register the app".

This is where I'm not so sure I did things right. The main part I wasn't sure about was this:

  1. Select the type of app: browser, native, server, or multiple.
  2. For each redirect Uniform Resource Identifier (URI), enter the address in the format ["https://<server>[:port]"] or ["http://<server>[:port]"] and click Add.

Is my app a "browser"? I assumed it was. And the server[:port] thing is confusing too. At first I thought it was my local PC WAB Dev spot (so "https://awelsh:3344"). But then thought this can't be right and choose my company website spot where I hosted my app (a URL that can be accessed anywhere).

Either way, I went through to the "embed and online app" instructions and again am not sure I did it right. I took out the URL of the original "src" link and put in my link from my company's website. When I opened this test html page that I created, I still got the login stuff.

So, I will try a few more things but I'm not sure I'll get a full resolution out of this soon! I'm not giving up hope though, haha.

Thanks again for your help and follow ups.

0 Kudos
MichaelBoyce
Esri Contributor

Hi Adrian,

All right...

Is this the part that you were referring to with the comment below?

<iframe width="500" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://arcgis.com/apps/Viewer/index.html?appid=1fa6b89a300c4e9ebf84613dd5c44b9f"></iframe>

 
took out the URL of the original "src" link and put in my link from my company's website. When I opened this test html page that I created, I still got the login stuff.

If so, what you are meant to do is to take that whole code section and embed it into the place where the custom app should go on your site.  Essentially what you are doing is setting up an iframe that links directly to the app that is hosted on AGOL within your web page.

I think that you are almost there.

Just to summarise the process from the top:

  1. Build App in Web App Builder
  2. Export App and Host it on AGOL
  3. Then embed the AGOL version of the app into your home page


Let me know how you go,

Michael

AdrianWelsh
MVP Notable Contributor

Michael,

Thanks so much for sticking with me and helping me out. I really do appreciate it.

I might not be explaining things properly and I also might not be doing things properly. On my company's website (which uses WordPress), I have a "backdoor" into the server side of things where I host my WAB apps (and other things like pictures and other media for story maps and just general storage).

This link, which is very raw and not something I intend the public to see is where my few maps are:

https:/******/Maps/

Each link clicked on will bring you straight to the WAB app that I made in Developer edition (since it links to the html page of index.html, etc. as intended). The first four maps I made in there were with WAB 2.4 and before, and I don't remember exactly what I did. The latest one (https://*****/18077/) was made with WAB 2.14 and giving me issues. I don't want to try this map with 2.4 but am not sure if I just did something wrong in the publishing, etc. 

So that being said, I intend for a link to be clicked on to bring me straight to the WAB app, not going to a web page that has the WAB app embedded into it from an iframe (though, I am willing to see what I can do to make this work...).

To hopefully answer your question above, this is what my html page looks like

<!DOCTYPE html>
<html>
<head>
<!-- Metadata goes here -->
</head>
<body>
<!-- Content goes here -->

<style>.embed-container {position: relative; padding-bottom: 80%; height: 0; max-width: 100%;} .embed-container iframe, .embed-container object, .embed-container iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;} small{position: absolute; z-index: 40; bottom: 0; margin-bottom: -15px;}</style><div class="embed-container"><iframe width="500" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" title="title" src="https://*******/18077"></iframe></div>

</body>
</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

That's the entire page. I replaced the original src link (which was:

//******&home=true&zoom=true&previewImage=false&scale=true&search=true&searchextent=true&legend=true&disable_scroll=true&theme=light

)

with my WAB link (https://*****/18077/).

So in hoping to follow directions right, I know number 1 is done (building the WAB app). Number 2, I exported the map app to a template

I exported it to my org (when I look at it now it says update)

and followed the instructions on placing the item in my org with the new group etc (that all seemed to work).

It's the "Register an App" page that I'm guessing I have issues with. This is what my settings page looks like in the template I exported to my org:

[image removed]

Either way, that's where I'm stuck. I greatly appreciate your help and hope to get this resolved soon! (and sorry for the long post, you don't have to read it all)

Thanks again, 

Adrian

0 Kudos