如何在CAS身份验证重定向中使用angularjs路由，还是不能使用angular? [英] How to use angularjs routing with CAS authentication redirect, or is angular just not usable?

问题描述

我的应用通常使用以下路由:

My app usually uses the following for routing:

http://angularapp.com/#/page=bannanas

但是，如果用户未通过身份验证，则将用户重定向到CAS登录页面，然后在登录后将其重定向回:

However, if the user is not authenticated, the user is redirected to a CAS login page, then after login, is redirected back to:

http://angularapp.com/

在重定向后，由于不支持锚标记，CAS会完全剥离锚/路由#/". https://issues.jasig.org/browse/CAS-1338

Notice after redirect, CAS completely strips out the anchor/route "#/" since the anchor tag is not supported. https://issues.jasig.org/browse/CAS-1338

解决此问题的最佳方法是什么?有没有办法我可以做这样的事情:

What is the best way around this? Is there a way I can do something like this:

http://angularapp.com/?page=bannanas

这将触发以下相同的路由: http://angularapp.com/#/page=bannanas

That triggers the same routing of: http://angularapp.com/#/page=bannanas

因为CAS会在重定向时保留查询参数(只是不锚定)?还是有更好的方法来解决这个问题?

Since CAS will preserve query parameters (just not anchors) on redirection? Or is there a better way to handle this?

推荐答案

在重定向到CAS服务之前，您需要对目标URL进行url编码.当呼叫从服务返回时，您将对其解码并在应用程序内重定向.

You will need to url-encode the destination URL before redirecting to your CAS service. When the call comes back from the service you'd decode it and redirect within your application.

如果您正在使用Java或.NET或类似的东西，则可以使用过滤器/servlet在角度应用程序之外处理所有这些问题.

If you are using Java or .NET or something similar you could handle all this outside of your angular app with a filter / servlet.

但这是基本概念.从您的示例中，您的角度应用程序位于http://angularapp.com/.

But here's the basic idea. From your example your angular app is at http://angularapp.com/.

1. 用户请求页面http://angularapp.com/#/page=bannanas，该页面需要重定向到CAS服务器进行登录.您应该对该URL进行编码，并将其作为请求参数传递，例如http://your-cas-site/login?returnUrl=http%3A%2F%2Fangularapp.com%2F%23%2Fpage%3Dbannanas

1. User requests page http://angularapp.com/#/page=bannanas which needs to redirect to the CAS server for sign-in. You should encode that URL and pass it along as a request parameter, such as http://your-cas-site/login?returnUrl=http%3A%2F%2Fangularapp.com%2F%23%2Fpage%3Dbannanas

CAS处理身份验证并重定向回您的应用程序.

CAS handles authentication and redirects back to your application.

在您的应用程序中，编写一个$http interceptor来监视请求参数returnUrl.找到它后，解码returnUrl=http%3A%2F%2Fangularapp.com%2F%23%2Fpage%3Dbannanas并重定向到它:http://angularapp.com/#/page=bannanas

In your app, write an $http interceptor that watches for a request parameter of returnUrl. When you find it, decode the returnUrl=http%3A%2F%2Fangularapp.com%2F%23%2Fpage%3Dbannanas and redirect to it: http://angularapp.com/#/page=bannanas

如果您的应用程序服务器支持，也可以由过滤器从外部进行处理. (我已经在Java中为我的应用程序完成了此操作，但是.NET和大多数其他服务器都支持相同的功能.)

This could also be handled externally by a filter if your application server supports that. (I've done this in Java for my app, but .NET and most other servers support the same thing).

-

根据要求添加此示例代码.这是我的身份验证过滤器，用于处理重定向到登录页面的操作.

Adding this example code as requested. Here's my auth filter that handles redirects to a login page.

import java.io.IOException;
import java.net.URLEncoder;

import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class LoginRedirect implements Filter {

  @Override
  public void destroy() {

  }

  @Override
  public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
      throws IOException, ServletException {

    HttpServletRequest httpServletRequest = (HttpServletRequest) request;
    HttpServletResponse httpServletResponse = (HttpServletResponse) response;

    // See if user has an active session.
    User currentUser = UserService.getCurrentUser(httpServletRequest.getSession());
    if (currentUser == null) {
      // No active session, need to error or redirect.
      if (httpServletRequest.getRequestURI().indexOf(httpServletRequest.getContextPath() + "/api/") == 0) {
        // For API requests, return an UNATHORIZED http response.
        httpServletResponse.sendError(HttpServletResponse.SC_UNAUTHORIZED);
      } else {
        // For all other requests, forward the user to the login page.
        StringBuilder returnTo = new StringBuilder();
        returnTo.append(httpServletRequest.getRequestURI());
        if (httpServletRequest.getQueryString() != null) {
          returnTo.append("?");
          returnTo.append(httpServletRequest.getQueryString());
        }
        httpServletResponse.setStatus(HttpServletResponse.SC_UNAUTHORIZED);
        httpServletResponse.sendRedirect(httpServletRequest.getContextPath() + "/login?returnTo=" +
            URLEncoder.encode(returnTo.toString(), "UTF-8"));
      }
    } else if (currentUser.isDeleted() || currentUser.isLocked()
        || (!currentUser.isRoleAdmin() && !currentUser.isRoleStaff())) {
      httpServletResponse.sendError(HttpServletResponse.SC_FORBIDDEN);
    } else {
      chain.doFilter(httpServletRequest, httpServletResponse);
    }
  }

  @Override
  public void init(FilterConfig filterConfig) throws ServletException {

  }

}

这篇关于如何在CAS身份验证重定向中使用angularjs路由，还是不能使用angular?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！