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

Pra*_*esh 5 asp.net-mvc facebook google-authentication asp.net-core-webapi asp.net-core-2.0

我有一个使用 asp.net core Web API 的 angular 应用程序。我需要为 google 和 facebook 登录添加外部身份验证,以便我的 Web 和移动应用程序可以使用此 Web api 对用户进行身份验证。我已经浏览了为此提供的文档和教程,例如 thisthis, 但它们都没有帮助我,因为我的Web应用程序在Angular 5上。

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

大多数情况下,它们都使用脚手架的 Asp.net mvc 应用程序,其中有一个控制器:AccountController with Methods ExternalLogins

GET /api/Account/ExternalLogins?returnUrl=%2F&generateState=true
Run Code Online (Sandbox Code Playgroud)

他们说响应将是这样的 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"}]
Run Code Online (Sandbox Code Playgroud)

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

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

我希望我足够清楚。

请告诉我是否需要详细说明。

请帮忙。谢谢。

小智 0

您需要在 API 中的控制器之一中创建 Google 身份验证挑战,并从角度应用程序重定向到该 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;
    }
Run Code Online (Sandbox Code Playgroud)

单击谷歌登录按钮时调用的组件方法

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