使用 c# web api 进行 Microsoft Azure 身份验证答案

【问题标题】：Microsoft Azure authentication with c# web api使用 c# web api 进行 Microsoft Azure 身份验证
【发布时间】：2018-02-04 15:08:57
【问题描述】：

我是 Azure、C# 和 Web API 的新手，所以首先我想提前道歉，因为这听起来像是一个愚蠢的问题。

我只是想知道，当我在本地开发 C# Web API 和前端 Web 应用程序时，我是否已经在使用 Azure 的身份验证？比如使用某人的 Microsoft 帐户进行身份验证？

谢谢！

编辑

所以我已经根据此链接设置了应用程序： https://docs.microsoft.com/en-us/azure/app-service-mobile/app-service-mobile-how-to-configure-microsoft-authentication

在我的前端 Web 应用程序上，当用户未通过身份验证时，它会被重定向到 Microsoft 的登录页面，当我尝试登录时，我收到以下错误：

另外请注意，我还没有在 Azure 上部署任何东西，我的代码仍然是本地的，我现在只需要身份验证。

希望有人能再次帮助我。

谢谢

更新

所以我能够通过使用某人创建的 msalx 库来实现 MSAL，这使得将 msal 集成到 Angular 中成为可能。使用我的个人 Microsoft 帐户登录后，我已经可以获取访问令牌，但问题是当我访问我的 Web API 时，它总是显示 401 Unauthorized。

提前致谢！

【问题讨论】：

标签： c# azure asp.net-web-api

【解决方案1】：

据我了解，您正在尝试使用他们的 Microsoft 帐户对用户进行身份验证。

这里是关于如何设置和启用您的网络应用以使用基于 Microsoft 帐户的身份验证的有用指南。

https://docs.microsoft.com/en-us/azure/app-service-mobile/app-service-mobile-how-to-configure-microsoft-authentication

此外，您可以在设置和配置本地应用程序后在本地对其进行测试。

这是一个使用 Microsoft 帐户身份验证的 GitHub 存储库示例 Web 应用程序。

https://github.com/lexdevel/MicrosoftAccountAuthentication

【讨论】：

您好，谢谢您的回答，我已经编辑了我的问题。请参见。谢谢

【解决方案2】：

AFAIK，为了使用 App Service Authentication / Authorization，您的 C# Web API 需要部署到 azure。应用服务身份验证/授权 (Easy Auth) 是 Azure 应用服务的一项功能，并作为本机 IIS 模块实现，该模块与你的 Azure 应用程序在同一沙箱中运行。更多详情可以参考Architecture of Azure App Service Authentication / Authorization。

根据您的情况，您可以参考以下方法：

使用应用服务身份验证/授权（简易身份验证）

configure your App Service application to use Microsoft Account login
通过浏览器访问https://{your-appname}.azurewebsites.net/.auth/login/microsoftaccount，确保您已成功设置您的Web API，并且只有通过Microsoft帐户身份验证的用户才能访问您的Web API
对于您的前端 Web 应用程序，您可以利用 JavaScript client library for Azure Mobile Apps 进行日志记录并检索 authenticationToken 和 userId，然后您可以将带有值 authenticationToken 的 x-zumo-auth 请求标头设置为令牌用于访问您的 Web API，如下所示：

有关如何验证用户的更多详细信息，您可以参考How to: Authenticate users。

注意：对于您的本地 SPA，您需要配置 CORS 设置并在您的 Azure Web 应用的“设置 > 身份验证/授权”下添加 允许的外部重定向 URL .更多详情可以参考这个issue。

在您的 Web API 中设置身份验证

您可以设置 OAuth 2.0 Bearer 身份验证，使用 AD v2.0 端点，您可以使用个人 MSA 和工作或学校帐户保护您的 Web API。关于如何构建您的 Web API，您可以参考Secure an MVC web API。
对于您的前端 Web 应用，您可以利用 MSAL.js 库来记录和检索 access_token，并使用该令牌调用您的 Web API HTTP bearer request。

更新：

我使用了AppModelv2-WebAPI-DotNet的TodoListService项目，然后为我的客户使用以下html如下：

<!DOCTYPE html>
<html>
<head>
    <title>Login</title>
    <meta charset="utf-8" />

    <!-- IE support: add promises polyfill before msal.js  -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js" class="pre"></script>
    <script src="https://secure.aadcdn.microsoftonline-p.com/lib/0.1.1/js/msal.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
    <script class="pre">
    var userAgentApplication = new Msal.UserAgentApplication("b3dd78af-d9da-459d-bf01-f87104d87450", null, function (errorDes, token, error, tokenType) {
        // this callback is called after loginRedirect OR acquireTokenRedirect (not used for loginPopup/aquireTokenPopup)
    });

    userAgentApplication.loginPopup(["user.read"]).then(function (token) {
        var user = userAgentApplication.getUser();
        console.log(user);
        console.log('access token:' + token);

        InvokeApi(token);

    }, function (error) {
        alert('login error:' + error);
    });

    function InvokeApi(token) {
        $.ajax({
            type: "GET",
            url: "http://localhost:9184/api/values",
            headers: {
                'Authorization': 'Bearer ' + token,
            },
        }).done(function (data) {
            console.log('invoked Web API \'http://localhost:9184/api/values\' with result: ' + data);
            alert(data);
        }).fail(function (jqXHR, textStatus) {
            alert('Error getting data');
        });
    }
    </script>
</body>
</html>

结果：

另外，你可以参考这个 git 示例JavaScript Single Page Application with an ASP.NET backend, using msal.js。

【讨论】：

所以本质上我只能在我的 API 或应用程序已经部署在那里的情况下使用 Azure 的身份验证？有没有一种方法可以让我使用他们的 Microsoft 帐户对用户进行身份验证，而无需部署到 Azure？
对于内置的 Easy Auth 功能，您目前只能在 Azure 上使用它。根据您的要求，您可以利用选项 2，然后您的 Web api 可以在不部署到 Azure 的情况下运行。您可以按照上述教程构建您的 Web api，并使用 MSAL.js 进行 MSA 身份验证，然后使用令牌访问您的 Web api。
好的，这也意味着在开发稍后将部署在 Azure 中的 Web 应用程序时，我不需要在 Azure 中订阅？顺便说一句，谢谢你的回答，它澄清了我的要求。我会选择第二个选项。
是的，您可以在本地开发它，然后稍后将其部署到 azure。实施您的应用程序时有任何问题，请随时告诉我们。
我用一些测试和教程更新了我的答案，你可以参考他们。