Login from Angular app using Duende BFF login endpoint - identityserver4

How to implement login authentication using Angular and Duende BFF?
I've set up the BFF client in Duende IS and when I hit BFF login from my angular app, it works but it redirects to BFF, not the angular app. How can I achieve this?

pass a redirectUrl querystring parameter to the call to login, as long as it is a relative path it will be fine.
you can also override the default ILoginService implementation in your startup:
services.AddTransient<ILoginService, MyCustomLoginService>();
and in the ProcessRequestAsync method of that service modify the redirectUri as you see fit (look to the DefaultLoginService implementation)
I would recommend either to have some redirect-uri options in your config or make sure the redirecturi is in the caller's domain to avoid open redirects.

Related

Keycloak - How to add Back to app link on login page

I would like to know how to add a Back to App link on the keycloak login page.
I'm using a react front end, and when i use the method keycloak.login() i'm going to my keycloak server. And here i want to add the possibility to go back to my app on the redirectUri sent by the keycloak login method.
I don't find any options in the realm management, and i have created a custom theme and i don't get the name of the properties to acces to the redirectUri link.
Thank's
Arthur
in the login/template.ftl file you have access to a client variable. This variable is an instance of ClientBean. This bean exposes a variable baseUrl, which you can use to link to your client application.
For Example:
${kcSanitize(msg("loginTitleHtml",(realm.displayNameHtml!'')))?no_esc}
In my case I wanted to use my app's sign up page via a link in keycloak login page.
What I did was I set my app base url in "Base url" in my client settings. And then I was able to access it from login.ftl using "${client.baseUrl}"

IdenityServer4 - doesn't redirect after MFA

My Auth Server uses IdentityServer4.
Redirect configured as follows for a client
RedirectUris = new List<string>
{
"https://localhost:44342/signin-oidc"
}
this works fine for those users for whom MFA is not enabled. But when it is enabled, and kicks in, the redirect doesn't work. After successful 2nd FA, user stays back on the AuthServer page.
Any idea why?
Multifactor authentication is not implemented by Identityserver4. Identityserver4 is about how the third party application gets access to protected resources on behalf of the user.
The means of how the user gets authenticated are out of the identityserver4 scope. In other words, this is not related to identityserver4.
If you're using the identityserver4 quickstart it comes with ASPNET Identity, ASPNET Identity provides you with a local authentication system for ASPNET applications. MultiFactor Authentication is probably there.
Being said that, when you try to POST to the /authorize endpoint (note authorize not authenticate) from your client application IdentityServer tries to authorize your request and to do so it makes you authenticate first, by presenting you the Login Form.
If you look at the Address bar on this point, you'll notice there's an encoded url as returnUrl param, on the controller code you'll see a check that if that param is present, redirect to that url after successful login.
So, check the flow on your application and see where does that parameter get lost on the redirect hell, at some point you're not passing the returnUrl.

Siteminder SSO + Spring Security + Angular JS

I have seen lot of examples where, there is a custom Login page with Angular JS, and then we make a rest POST call with the username/pwd, and then Spring authenticates based on whatever Auth Service we provide. Then we receive a success, grab the user object from Spring Security and then create a Session cookie in Angular.
https://github.com/witoldsz/angular-http-auth/blob/master/src/http-auth-interceptor.js
I also have seen, integrating Siteminder with Spring Security where we install a policy agent on the web server, and then grab request headers with Spring Security, and then pull the roles and build a user profile object.
I'm looking for a solution where I can combine both the above. This is the scenario :
When the user requests for index.html (Angular), the policy agent on the web server intercepts, authenticates with a Siteminder login page and then passes the headers to the app server. The Spring Security on app server will read the headers and pull the roles from our app database and then build a userprofile object. Now here, I want to continue the flow and display angular page, but Im trying to figure out, how do I send the user profile object to angular, because angular is not making a POST call at this point. Also, how do I get the http-auth-interceptor in play, because I need to keep checking if the user is still authenticated on the change of every view/state in Angular.
Help appreciated ! Thanks !
You may implement a tiny JSON REST service "/your-app/profile" which is protected by SiteMinder, reads and evaluates the headers and returns the result as a JSON object.
Your Angular App (e.g. /your-app/index.html) should better also be protected by SiteMinder so you receive an immediate redirect to the SSO Login when accessing it without session. In addition, it must read the JSON REST resource "/your-app/profile" when loaded. It must also expect that SMSESSION is missing when reading "/your-app/profile" and react accordingly - perform a reload of the protected index.html page to trigger a SM SSO re-login (if "/your-app/index.html" is protected, otherwise you must trigger login by a redirect to some protected resource).
If you want to constantly check to see if SiteMinder session is still present, you may either access the "/your-app/profile" or check for the presence of the SMSESSION cookie (only in case it is not set as HTTP-only).
One SECURITY NOTE: If you rely on the seamless SSO which is provided via SMSESSION cookie, be aware of the possible CSRF (Cross-Site Request Forgery) attacks!
Apparently both roles and the username will be available in spring if the integration is done as this describes
Integrating Spring Security with SiteMinder

Azure AD auth redirect not using configured reply url

I have registered an angular app with Azure AD for authentication. After auth, Azure redirects back to my app as designated by the "Reply Url" in the Azure config.
Reply Url = http://myapp.com/#/?
The app expects url parameter fragments (such as auth code, token, state, etc) appended to the redirect url, which are checked if user auth succeeded.
Redirect Url = http://myapp.com/#/?code=<some code>&id_token=<id token>&...
This was working before, but as of yesterday the redirect url now looks like this
Redirect Url = http://myapp.com/#code=<some code>&id_token=<id token>&...
No changes were made to the app config in azure management portal.
This new format is breaking angular routing in the app, and the auth parameters are not being captured/parsed. Everything after the "#" in the reply url seems to be ignored.
Any idea as to what causes the redirect url not to use the complete reply url configured in Azure AD?
As I know, Reply Url configured on Azure AD is just to validate the location.origin of the redirected url.
This redirected url can be configured by setting redirectUri option in the adalAuthenticationServiceProvider.init method (as you're making Angular app).
Back to your question, I have same redirect url format #id_token=... without ? character. But all good for me because I can access all necessary values by accessing adalAuthenticationService.userInfo object.
Check out here for more detailed info.
Hope it helps in your case.
What I did was to use HTML5 mode on the Angular side.
You can see how I configured ADAL and routing:
$locationProvider.html5Mode(true).hashPrefix("!");
var endpoints = {
"/api": "https://app-id-uri"
};
adalAuthenticationServiceProvider.init(
{
clientId: "12345678-1234-1234-1234-123456789012",
endpoints: endpoints
},
$httpProvider
);
On server-side it was then important to return the index page no matter what route was hit, since routing is done client-side. Now AAD returns the code in the fragment as usual and all routing works as well.

Adding http headers to window.location.href in Angular app

I have a angular app that I needed to redirect outside to a non angular html page, so I thought I could just use the $window.location.hrefto redirect the angular app to my external site. This actually works fine, however, I have a nodejs/express backend that checks for auth token before serving up any content(even static content).
This requires a auth token to be sent in the header of the http request. Now the question:
Can/How do you add an auth token to the request that is made by changing the $window.location.href before it is sent off?
When you use $window.location.href the browser is making the HTTP request and not your JavaScript code. Therefore, you cannot add a custom header like Authorization with your token value.
You could add a cookie via JavaScript and put your auth token there. The cookies will automatically be sent from the browser. However, you will want to review the security implications of using a cookie vs. a header. Since both are accessible via JavaScript, there is no additional attack vector there. Unless you remove the cookie after the new page loads, there may be a CSRF exploit available.
This answer is NOT a safe way, as the token is exposed in the URL, which is logged in browser history, access logs, etc. Use a domain cookie instead. I'll leave the answer as it can be an easy way to debug in your local setup.
I am using JWT as authentication on a Laravel PHP backend, and it works by putting ?token=... in the URL. For example, when using AngularJS with satellizer plug-in, I add ?token=' + $auth.getToken() to the URL.

Resources