01-23-2020 10:10 AM
We are considering creating an Angular 8 front end with .NET Core back end web site. Not sure how to integrate the two differing ends with a DUO push notification process.
The existing example from the WebSDK is a bit confusing in that regard. Does anyone already have experience in this area that could point us in the right direction? We already have the keys and application set up in the DUO admin area - we just need some idea how to incorporate the code into the web site properly. Thanks.
P.S. Duo Support made this statement
Because unexplored and unique webserver environments can be problematic to provide an all-encompassing solution for, it is necessary that Duo support not be involved in the architecture of code outside of the scope of the standard code we provide.
They basically said they are unable to discuss the issue with me and pointed me to the community forums to see if other folks had done such an implementation successfully.
Solved! Go to Solution.
01-27-2020 10:56 AM
Moved the Angular code to the On Init method instead of the After View Init method and it works.
01-27-2020 09:52 AM
So, just a bit of an update - I am having a partially working solution in that I can click a button, call the sign request functionality and get the sig-request value back from Duo.
My problem lies with the secondary portion of the functionality using the iframe. When I receive the sig-request I am routing to a new page that is supposed to hold the iframe. When I put an iframe into the html I immediately get an error saying that the host is missing from the Duo init. When I remove the iframe the screen just stays blank.
<iframe id='duo_iframe'
title='Two-Factor Authentication'
frameborder='0'>
</iframe>
ngAfterViewInit() {
if (this.duo.signRequest.length > 0) {
console.log(this.duo.signRequest);
Duo.init({
iframe: "duo_iframe",
host: this.hostName,
sig_request: this.duo.signRequest,
submit_callback: this.twoFactorVerify.bind(this),
});
}
}
I know this is sort of working because I can read the duo.signRequest (there is a value), but no matter what I do the iframe is not working.
Anyone out there know what I’m talking about and how I might look at this differently in order to get it working?
01-27-2020 10:56 AM
Moved the Angular code to the On Init method instead of the After View Init method and it works.
02-27-2020 11:53 PM
Hey @Carolyn, I’m stuck in a similar situation.
In my case, I’m using Ember.js, not Angular.
The IFrame element appears on the screen, but it has no content. I have set up the Duo.init values correctly, but no matter what I do, the IFrame is blank.
Just a mention - I’m using ES6 module from here - https://github.com/duosecurity/duo_web_sdk
Let me know if you know the solution.
Thanks…
03-02-2020 02:16 PM
Two things to validate:
#duo_iframe {
width: 100%;
min-width: 304px;
max-width: 600px;
height: 320px;
display: block;
margin: 0 auto;
}
Basically, stepping through the process looked like this for my code base
Hopefully, somewhere in there is a nugget that is helpful for you. Good luck!
03-02-2020 11:50 PM
Thanks @Carolyn,
I required a simple fix, somewhat similar to yours.
I was calling the Duo.init
before the IFrame
element containing HTML could load. I made sure I called the method after the HTML loaded. This helped show the IFrame
properly.
07-22-2020 07:49 PM
Hi Carolyn,
In my case i am using angular 8 as front end and .net core as back-end and till duo authentication process is working fine once the user authenticated success fully i need to redirect the page to home screen and i am using the server post method and its API call from MVC controller and to redirect i cannot do it from service code. its need to down from client side code. can you suggest me how exactly i need to write in angular for redirect to home screen and below code the post method code.
string authuser = Duo.Web.VerifyResponse(keys sig_response);
string loggedInUser = string.Empty;
foreach (var item in RequestQueue.Queue)
{
loggedInUser = item.ToString();
}
bool isDuoAuthenticated = authuser == loggedInUser;
//Response.Redirect
return Json(new { isDuoAuthenticated });
04-27-2023 02:03 AM
Hi @Carolyn ,
How did you get the sig_request sig_request: this.duo.signRequest
like this: TX|YWI0OTgxNDg=|cb88d6f90:APP|YWI2NDU0NDg=|10f4d22a
. From my account, I only get the secret ID, client ID and host.
Discover and save your favorite ideas. Come back to expert answers, step-by-step guides, recent topics, and more.
New here? Get started with these tips. How to use Community New member guide