ASP.NET 核心 Web API 和 Angular 客户端中的外部身份验证答案

【问题标题】：External authentication in ASP.NET core Web API and Angular ClientASP.NET 核心 Web API 和 Angular 客户端中的外部身份验证
【发布时间】：2018-06-15 11:47:45
【问题描述】：

我有一个使用 asp.net 核心 Web API 的 Angular 应用程序。我需要为 google 和 facebook 登录添加外部身份验证，以便我的 web 和移动应用程序可以使用这个 web api 来验证用户。我已经浏览了为此提供的文档和教程喜欢 this one 和 also this 但他们都没有帮助我，因为我的网络应用程序在 Angular 5 上。

我的实际问题是如何获取将我重定向到 Google 或 facebook 登录页面的 URL。

他们大多使用支架式 Asp.net mvc 应用程序，其中有一个控制器：AccountController with Methods ExternalLogins

GET /api/Account/ExternalLogins?returnUrl=%2F&generateState=true

他们说响应将是这样的 json：

   [{"name":"Facebook",
  "url":"/api/Account/ExternalLogin?provider=Facebook&response_type=token&client_id=self&redirect_uri=http%3A%2F%2Flocalhost%3A15359%2F&state=QotufgXRptkAfJvcthIOWBnGZydgVkZWsx8YrQepeDk1",
  "state":"QotufgXRptkAfJvcthIOWBnGZydgVkZWsx8YrQepeDk1"}]

这个 JSON 正是我需要的，因为我需要一个这样的 URL 来打开 facebook 或 google 登录页面。上面的链接使用脚手架项目，并且已经编写的每个代码都适用于 Asp.net Web 应用程序。但就我而言，我已经从头开始了 web api，我的 web 应用程序是 Angular 5。另外，如果我尝试了一个支架式 web api 项目，但我找不到任何名为 AccountController 的控制器，也找不到任何名为 ExternalLogins 的方法来获取 JSON包含提供商名称和登录页面 url。看起来它的完成方式在.net core 2中已经改变了。上面的第一个链接显示了两种在 Asp.net core 1 和 Asp.net Core 2 的启动类文件中包含 GoogleAuthentication 的方法。所以我一定缺少一些东西。

我正在使用 Asp.net core 2。我已经获得了 Api 密钥和秘密并添加到启动类文件中。

我希望我足够清楚。

如果我需要详细说明，请告诉我。

请帮忙。谢谢。

【问题讨论】：

标签： asp.net-mvc facebook asp.net-core-2.0 google-authentication asp.net-core-webapi

【解决方案1】：

您需要在 API 中的一个控制器中为 Google 身份验证创建挑战，然后从 Angular 应用重定向到该 API 控制器。

控制器方法

    [HttpGet("ExternalLogin")]
    public IActionResult ExternalLogin(string provider)
    {
        if (provider == null)
        {
            return null;
        }

        var properties = new AuthenticationProperties { RedirectUri = "www.mydomain.com/api/auth/callback" };
        var response = Challenge(properties, provider);
        return response;
    }

点击谷歌登录按钮调用组件方法

externalLogin(provider:string){
this.document.location.href = this.baseAPIUrl + 'auth/externallogin?provider='+provider;
}

【讨论】：