This is a follow up question to Angular App Hosting Azure Storage Container - Azure Authentication Callback and Routing fails.
Summary:
I want to host my Angular 8 app on an Azure Storage Account. To make the routing work I had to turn on the HashLocationStrategy. This strategy prefixes the routes with a hashtag like this: https://<projectname>.z6.web.core.windows.net/#/auth/login
The routing works now but the Azure OAuth2 process adds the access token information to the base url also by using a hashtag: <baseurl>/<callbackurl>#access_token=eyJ0eXAiOiJKV1Q...
.
Without using the HashLocationStrategy the route would be like this (callback route is /auth/callback
):
https://<projectname>.z6.web.core.windows.net/auth/callback#access_token=eyJ0eXAiOiJKV1Q...
With HashLocationStrategy it should be like this:
https://<projectname>.z6.web.core.windows.net/#/auth/callback#access_token=eyJ0eXAiOiJKV1Q...
But what it does is this:
https://<projectname>.z6.web.core.windows.net/#access_token=eyJ0eXAiOiJKV1Q...
It just swallows the callback url part and adds the access_token part directly behind the base url. The redirect fails.
Is there a way to make Azure OAuth2 work with HashLocationStrategy?
I've not investigated all the facets of your question nor have I needed to leverage HashLocationStrategy, but on S3 buckets we've specified the custom 404 page to point to the index.html file, similar to a suggestion in the Angular Deployment documentation for use in static GitHub Pages.
In Azure's Static website hosting in Azure Storage page, it indicates that a custom 404 page can be specified. You could try to specify the index.html file as well. This effectively "actives" the Angular router on non URL-rewritable hosting - at least this worked on S3 static site hosting.