从Angular 5注销MVC应用程序

时间:2018-07-26 13:19:29

标签: asp.net-core angular5 identityserver4 logout

我们有一个基于MVC身份验证的angular 5应用程序。该应用程序通过“主页/索引”操作提供服务,并且在加载应用程序后,角度路由几乎可以处理所有事情。之所以这样做,主要是因为我们想使用MVC的身份验证过程(我们将Identity Server 4作为我们的Oath系统)。

这很好工作,但有一个例外:注销。当我们尝试注销时,该应用程序似乎立即被重新授权并重新加载,而不是使我们返回到Identity Server登录页面。

最初,通过以下代码,我们在开发环境中取得了成功:

[HttpPost]
public async Task<IActionResult> Logout()
{
  foreach (string key in Request.Cookies.Keys)
  {
    Response.Cookies.Delete(key);
  }

  await HttpContext.SignOutAsync();

  return Ok();
}

但这是一个错误的肯定,因为我们所有的应用程序都在localhost上运行,因此它们可以访问彼此的cookie。因此,Identity Server cookie和Angular应用程序的cookie一起被清除。

我们尝试用以下内容替换该逻辑:

    public async Task Logout()
    {
        if (User?.Identity.IsAuthenticated == true)
        {
            // delete local authentication cookie
            await HttpContext.SignOutAsync("Cookies");
            await HttpContext.SignOutAsync("oidc");
        }
    }

但是,它没有在两种环境中注销(但是该代码适用于使用同一身份服务器的MVC应用程序之一)。

为了提供一些背景信息,我们在Angular应用程序中的注销过程来自物料菜单,然后在该菜单中提示用户是否真的要使用模式注销,然后再调用注销函数。此过程的代码段:

注销按钮调用的方法:

public openDialog(): void {
    let dialogRef = this.dialog.open(ModalComponent, {
      width: '250px',
      data: { text: this.logoutText, ok: this.okText, cancel: this.cancelText }
    });

    dialogRef.afterClosed().subscribe(result => {
      if (result !== undefined) {
        switch (result.data) {
          case 'ok':
            this.logout();
            break;
          case 'cancel':
            break;
          default:
            break;
        }
      }
   });
}

private logout(): void {
   this.sessionService.logOut();
}

会话服务:

public logOut(): void {
    this.auth.revokeToken();
    this.http.post(this.logoutUrl, undefined).subscribe(x => window.location.reload());
}

如前所述,以这种方式调用注销最终导致页面刷新,并且用户并未真正注销。我们可能缺少一些简单的东西,但是到目前为止,我所做的所有修补工作并没有取得任何成功。

编辑:

我们的角度路由相当简单(尽管路径阻止我们调用诸如home / logout之类的东西):

{
  path: 'parts',
  component: PartsComponent,
  canActivate: [AuthGuard],
  runGuardsAndResolvers: 'always',
  data: { title: 'Parts' }
},
{
  path: '',
  redirectTo: 'parts',
  pathMatch: 'full'
},
{
  path: '**',
  redirectTo: 'parts'
}

我们的MVC路线也相当简单

    app.UseMvc(routes =>
    {
      routes.MapRoute(
       name: "default",
       template: "{controller=Home}/{action=Index}/{id?}");

      routes.MapRoute(
       "Sitemap",
       "sitemap.xml",
       new { controller = "Home", action = "SitemapXml" });

      routes.MapSpaFallbackRoute(
        name: "spa-fallback",
        defaults: new { controller = "Home", action = "Index" });
    });

我不确定我们如何轻松地以角度路线轻松到达首页/登出路线。我猜我们必须为此添加一条路线。我们曾一度尝试过,但始终无法正确路由。我正在尝试找到我们尝试过的笔记。

2 个答案:

答案 0 :(得分:1)

清除了应用程序的本地cookie之后,将用户发送到您的Idsrv的end_session_endpoint。 (您显示的清除会话的代码应该可以工作,否则,我将在startup.cs中进行配置,并进行调试以检查重定向是否确实删除了浏览器中的cookie。)

例如https://demo.identityserver.io/.well-known/openid-configuration

在那里您可以看到端点。这应该删除Idsrv上的会话。根据您的设置,这可能会终止您在使用同一Identity Server实例的其他应用程序上的会话。

您可以在docs中了解有关此内容的更多信息。

我认为Angular路由不会干扰您的服务器端路由。当然,只要您确实使用常规的window.location.replace

重定向到该页面

当然,像@Win提到的那样,如果您使用refresh_token和reference_tokens,则将是一个很好的安全指南。

答案 1 :(得分:0)

我无法回答Angular;我还在努力。但是,当用户在客户端注销时,客户端Web应用程序可能会要求IDP撤销访问令牌并刷新令牌。例如,在ASP.Net Core中-

using System;
using System.Threading.Tasks;
using IdentityModel.Client;
using Microsoft.AspNetCore.Authentication;
using Microsoft.AspNetCore.Authentication.Cookies;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.AspNetCore.Mvc;
using Microsoft.IdentityModel.Protocols.OpenIdConnect;

namespace MY_APP.Controllers
{
    public class AccountController : Controller
    {
        [HttpGet]
        public async Task<IActionResult> SignOut()
        {
            var discoveryClient = new DiscoveryClient("IDP_URL");
            var metaDataResponse = await discoveryClient.GetAsync();

            var revocationClient = new TokenRevocationClient(
                metaDataResponse.RevocationEndpoint, 
                "CLIENT_NAME",
                "CLIENT_SECRET");

            // revoke the access token
            string accessToken = await HttpContext.GetTokenAsync(OpenIdConnectParameterNames.AccessToken);

            if (!string.IsNullOrWhiteSpace(accessToken))
            {
                var revokeAccessTokenResponse = await revocationClient.RevokeAccessTokenAsync(accessToken);

                if (revokeAccessTokenResponse.IsError)
                    throw new Exception("Problem encountered while revoking the access token.", 
                        revokeAccessTokenResponse.Exception);
            }

            // revoke the refresh token
            string refreshToken = await HttpContext.GetTokenAsync(OpenIdConnectParameterNames.RefreshToken);

            if (!string.IsNullOrWhiteSpace(refreshToken))
            {
                var revokeRefreshTokenResponse = await revocationClient.RevokeAccessTokenAsync(refreshToken);

                if (revokeRefreshTokenResponse.IsError)
                    throw new Exception("Problem encountered while revoking the refresh token.",
                        revokeRefreshTokenResponse.Exception);
            }

            return SignOut(
                new AuthenticationProperties { RedirectUri = "CALL_BACK_URL" },
                CookieAuthenticationDefaults.AuthenticationScheme,
                OpenIdConnectDefaults.AuthenticationScheme);
        }
    }
}