如何从 Angular 应用程序的 .Net Core 程序获取 Azure AD 身份验证 [英] How can I get Azure AD Authentication from .Net Core program for Angular app
问题描述
我有一个托管 Angular 10 应用程序的 .Net Core 3.1 程序.Angular 应用程序有一个登录页面，用户可以在其中输入用户名和密码，这些用户名和密码会发送到 .Net Core 中的登录函数，该函数返回一个 oAuth 令牌，该令牌用于从 Angular 对 api 的所有调用.只有在针对数据库检查用户名和密码后才会返回令牌.我想要一个使用 Microsoft 登录"用户可以单击登录表单上的按钮，而无需输入用户名和密码.我希望 .Net 核心应用程序然后调用 Azure Active Directory 并获取令牌.如果用户已经登录到 Azure AD，它只会返回令牌，否则它会要求用户提供他们的 Active AD 凭据，然后在成功登录后返回令牌. 然后 .Net Core 程序可以询问 Azure AD令牌(而不是检查数据库中的用户名和密码)，如果没问题，它会将 oAuth 令牌返回给 Angular 应用程序.除了 .Net Core 中的代码外，我对其中的大部分内容都很清楚:
I have a .Net Core 3.1 program that hosts an Angular 10 application. The Angular application has a login page where the user can enter a username and password which gets sent to a login function in .Net Core which returns an oAuth token that is used in all calls to the api from Angular. The token only gets returned once the username and password are checked against a database. I would like to have a "Sign in with Microsoft" button on the login form that the user could click instead of entering a username and password. I would like the .Net core application to then call Azure Active Directory and get a token. If the user is already signed into Azure AD, it would just return the token, if not it would asked the user for their Active AD credentials and then return the token after successful log in. The .Net Core program could then interrogate the Azure AD token (instead of checking username and password in the database) and if it is ok it would return the oAuth token to the Angular app. I'm clear on most of this apart from the code in .Net Core to do the following:
- 查看用户是否已登录 Azure AD，如果没有，则提示用户登录 Azure AD
- 向 Azure AD 发出请求，为经过身份验证的用户发送令牌
请帮忙.
推荐答案
当用户使用 Azure AD 登录时，有一个 您应该遵循的特定流程.就像 Angular 库一样，Microsoft.IdentityModel 库 可以对您隐藏大部分这种复杂性.由于您使用的是 Angular，因此在 SPA 中处理登录部分会更简单，但您不必这样做.
When signing a user in with Azure AD there is a specific flow you should follow. Just like for the Angular library, the Microsoft.IdentityModel library can hide most of this complexity from you. Since you are using Angular, handling the login portion in your SPA will be simpler, but you don't have to.
有一个示例应用程序专门使用 Angular 和 .NET Core 实现 AAD 身份验证:https://github.com/Azure-Samples/ms-identity-javascript-angular-spa-aspnetcore-webapi
There is a sample app that specifically implements AAD authentication with Angular and .NET Core: https://github.com/Azure-Samples/ms-identity-javascript-angular-spa-aspnetcore-webapi
还有一个教程介绍了几个不同的场景，包括您可能想要探索的示例应用程序:https://github.com/Azure-Samples/active-directory-aspnetcore-webapp-openidconnect-v2/
There's also a tutorial that goes through several different scenarios including that sample app that you may want to explore: https://github.com/Azure-Samples/active-directory-aspnetcore-webapp-openidconnect-v2/
您的 API 中有两个登录端点，您走在正确的道路上.主要问题是让您的 API 处理实际登录.如果需要让 Azure AD 对用户进行身份验证，则应该始终让 Azure AD 在浏览器中处理该问题.由于他们的 Microsoft 登录名不仅仅用于您的站点，因此用户在任何时候将其提供给您都会带来巨大的安全风险.如果他们的帐户启用了 2-factor，即使您拥有他们的用户名和密码，您的 API 也无法进行身份验证.
You are on the right path with having two login endpoints in your API. The main issue is having your API handle the actual login. If you need to have Azure AD authenticate a user, you should always have that handled by Azure AD in the browser. Since their Microsoft login isn't just for your site, it is a massive security risk for the user to give them to you at any point. If they have 2-factor enabled on their account, there is no way for your API to do the authentication even if you have their user name and password.
如果用户登录到 Azure AD 而不是您的站点，则不会要求他们再次登录.他们可能会看到弹出窗口或短暂重定向，但 Azure AD 会立即将他们发送回您的站点，并为您的 API 提供令牌.
If the user is signed in to Azure AD but not your site specifically they won't be asked to sign in again. They may see the popup or redirect briefly, but Azure AD will immediately send them back to your site with a token for your API.
这篇关于如何从 Angular 应用程序的 .Net Core 程序获取 Azure AD 身份验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
