2

我能够为我的 .netcore MVC 应用程序+reactjs(计费应用程序)进行身份验证和授权,此应用程序将托管在 IIS 上,并在计划托管 .netcore Webapi(图表应用程序)的同一台服务器上。

通过使用计费应用程序,我们将调用图表 WebApis。现在WebApi 应该是 Authenticate/Authorize user based on token sent by front-end app (基于token的webapi执行Auth/Autho,没有另一个登录弹出窗口)

  1. 能够使用邮递员生成令牌-通过请求以下链接查看 img

    https://login.microsoftonline.com/ {{tenandId}}/oauth2/token

将带有标头的此令牌发送到 Web-API,Web-API 将具有与计费应用相同的 Azure AD 应用配置(客户端 ID、范围等)。Api 应该验证令牌并发送图表数据。

  1. 应该在 reactjs 中尝试 adal/msal 并使用 Authorize 属性装饰 WebApis 以便处理身份验证和授权?

有很多链接,但很少有代码不起作用,很少有进程不再适用于 Azure,很少有大型代码,而不是我正在寻找的。

基本上,我将在 .netcore 中托管一个执行 Auth 部分的应用程序,现在 WebApi 也应该使用相同的用户 cookie/令牌进行 Auth,因为我不想再提供另一个登录弹出窗口,请参阅很多 MS 示例代码但没有运气

哪种方法是正确的 1 或 2,并分享示例代码/链接任何帮助表示赞赏,

4

2 回答 2

3

据我了解,您有一个名为 Billing App 的客户端应用程序将登录用户并通过基于用户的访问令牌调用 API。如果是这样,您应该注册两个应用程序,一个用于计费应用程序的客户端应用程序和一个服务端应用程序。对于客户端应用程序,因为这是一个客户端,您应该使用用户的凭据从 Azure AD 获取而不是应用程序客户端机密. 要实现这一点,您应该将其配置为 Azure AD 上的公共客户端并启用访问令牌和 ID 令牌: 在此处输入图像描述

由于您想获取服务端应用程序的调用 API,您应该授予以下权限以确保用户可以通过您的客户端应用程序获取访问令牌(假设“stanapitest”这里是服务端应用程序): 在此处输入图像描述 注意,请单击授予管理员同意 Devchat按钮以完成权限授予流程。 在此处输入图像描述 完成此过程后,您可以通过密码流获取基于用户的访问令牌:

在此处输入图像描述

OAuth2 授权代码流或 Oauth2 隐式授权流 ,当然取决于您的要求。

好的,到了服务端,演示.net core Api,让我们在VS中创建一个简单的.net core Api项目:

在此处输入图像描述

创建项目后,将客户端 ID 更改为您的服务应用 ID: 在此处输入图像描述

运行项目并调用它的 API,您可以看到它已被 Azure AD 保护: 在此处输入图像描述

使用基于用户的访问令牌调用此 API: 在此处输入图像描述

如您所见,它可以正常工作。希望能帮助到你 。如果您有任何进一步的疑虑,请随时告诉我。

于 2019-11-25T03:26:40.013 回答
0

在计费应用程序中进行身份验证后,当您想要获取访问令牌以访问您的另一个 Web api 应用程序时,您可以使用acquireTokenSilent向 Azure AD 发出静默请求(不使用 UI 提示用户)的方法(msal.js)调用以获取访问令牌。然后,Azure AD 服务会返回一个包含用户同意范围的访问令牌,以允许您的应用安全地调用 API。

最好将您的 web api 作为受 AAD 保护的独立资源,在您的前端 react 应用程序中,您可以 acquireTokenSilent在用户登录后获取访问 web api 的令牌:

// if the user is already logged in you can acquire a token
if (msalInstance.getAccount()) {
    var tokenRequest = {
        scopes: ["user.read", "mail.send"]
    };
    msalInstance.acquireTokenSilent(tokenRequest)
        .then(response => {
            // get access token from response
            // response.accessToken
        })
        .catch(err => {
            // could also check if err instance of InteractionRequiredAuthError if you can import the class.
            if (err.name === "InteractionRequiredAuthError") {
                return msalInstance.acquireTokenPopup(tokenRequest)
                    .then(response => {
                        // get access token from response
                        // response.accessToken
                    })
                    .catch(err => {
                        // handle error
                    });
            }
        });
} else {
    // user is not logged in, you will need to log them in to acquire a token
}
于 2019-11-25T05:44:27.383 回答