使用 AngularJS 和 Spring Security 的单页应用程序中需要 AntMatchers
Posted
技术标签:
【中文标题】使用 AngularJS 和 Spring Security 的单页应用程序中需要 AntMatchers【英文标题】：AntMatchers needed in a SinglePage Application using AngularJS and Spring Security 【发布时间】：2016-09-01 22:01:38 【问题描述】：我有一个单页应用程序客户端使用 AngularJS，而服务器端使用 Spring MVC、REST、Spring Data。部署应用程序时，spring mvc 呈现一个 JSP 页面，该页面具有对应于多个命名 ui-view 的 Angular JS 标签页面的各个部分，如页眉、页脚、菜单和主要内容区域。
Dispatcher servlet 的 url 映射为 /ui*。我唯一的 spring MVC 控制器将自身呈现给 home.jsp。 home.jsp 有多个命名的 angularJS ui-view 标签，如下所述。路由在 controller.js 中定义。 web.xml 如下图所示。使用 Spring 数据 mongodb 进行 CRUD 操作的 REST API 数不胜数。
我想使用带有 Java 配置的 Spring 安全性来保护这个应用程序。
我正在我的 SecurityConfiguration.java 文件中尝试如下代码，以允许在没有身份验证的情况下呈现登录页面，并且必须在从浏览器访问之前对其他页面进行身份验证。登录页面应该是应用程序的唯一入口点。但是，此代码不起作用。 请指教。
注意 :- 这是一个单页应用程序。应用程序只有一个 SpringMVC 控制器，当我们访问 url (http://localhost:8080/root/ui/login) 时，它会在应用程序 Home.jsp.Post 部署中呈现 singleJSP 根据 angularJS 应用程序中配置的路由，url 更改为使用 fragmentidentifier 作为 url (http://localhost:8080/root/ui/login#/login) 呈现登录页面。 单击任何其他超链接时，仅片段标识符会更改，并对 DB 进行 REST 调用并填充页面特定部分的数据。对于 Ex :- 单击 chDetail 超链接时，url 更改如下 (http://localhost:8080/root/ui/login#/chDetail) 并加载该部分的数据。请告知如何编写适当的 antMatchers 以便 登录页面可以不安全地访问，而其他页面需要经过身份验证才能访问。
安全配置代码如下：-（请在此处提供代码）
<code>
http.csrf().disable().httpBasic()
.and()
.authorizeRequests()
.antMatchers("/ui/login#/login").permitAll()
.antMatchers("/ui/login#/chDetail").authenticated();
</code>
应用程序其他层的代码sn-p如下，供参考。 Home.jsp 代码如下。
<code>
<body ng-app="bpApp" ui-view>
<script type="text/ng-template" id="applicationPagelayout.html">
<div class="grandContainer">
<div ui-view="header"></div>
<div class="menuSecCT">
<div ui-view="userStatus"></div>
<div ui-view="menu"></div>
</div>
<div class="mainContainer">
<div ui-view="content"></div>
</div>
<p ui-view="footer"></p>
</div>
</script>
</body>
</code>
路由控制器代码如下。
<code>
bpApp.config(['$stateProvider','$urlRouterProvider',function($stateProvider, $urlRouterProvider)
$urlRouterProvider.otherwise('/login');
$stateProvider.state('root',
url: '',
abstract:true,
views:
'':
templateUrl: 'applicationPagelayout.html'
,
'footer@root':
templateUrl:'resources/html/footer.html'
,
'header@root':
templateUrl:'resources/html/header.html'
,
'userStatus@root':
templateUrl:'resources/html/userStatus.html'
,
'menu@root':
templateUrl:'resources/html/menu.html'
).state('root.chDetail',
url: "/chDetail",
views:
'content':
templateUrl: "resources/html/chDetail.html",
controller: 'chDetailCtrl'
).state('login',
url: "/login",
controller: 'loginCtrl',
templateUrl: "resources/html/login.html"
);
]);
</code>
web.xml 如下定义了 cxfservlet for REST 的 url 模式和 UI 的 Dispatcher servlet。
<servlet-mapping>
<servlet-name>CXFServlet</servlet-name>
<url-pattern>/ws/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>dispatcherservlet</servlet-name>
<url-pattern>/ui/*</url-pattern>
</servlet-mapping>
项目中只有springmvc控制器
@Controller
@RequestMapping("/login")
public class ChController
@RequestMapping(method = RequestMethod.GET)
public String getListingPage()
return "HomePage";
还有很多使用 Apache-cxf 的 RESTFUL API。 Spring data Mongo-db 用于 mongodb 上的 CRUD。
【问题讨论】：
【参考方案1】：您需要将类似的内容添加到您的配置链中。
http.httpBasic()
.and()
.authorizeRequests()
.antMatchers("/root/ui/**").permitAll()
.anyRequest().authenticated();
【讨论】：
我有一个 login.html，它的 url 模式为 localhost:8080/root/ui/login 或 localhost:8080/root/ui/login/#login 。所有其他应用程序页面位于以下 localhost:8080/root/ui/login#> 的 url。因此，如果我提供适用于所有 url 的 /root/ui**。因此它全部可访问或没有。以上是关于使用 AngularJS 和 Spring Security 的单页应用程序中需要 AntMatchers的主要内容，如果未能解决你的问题，请参考以下文章
AngularJS、Spring Social 和 CORS
使用 Spring Security、Jersey 和 AngularJS 验证表单