AngularJS&带有ROLE_ANONYMOUS的Spring Security仍然返回401 [英] AngularJS & Spring Security with ROLE_ANONYMOUS still returns 401

问题描述

我们正在构建一个Angular Material应用程序，该应用程序将使用RESTful Spring MVC API和Spring Security& OAUTH2.

We are building an Angular Material application, consuming a RESTful Spring MVC API, with Spring Security & OAUTH2.

出于测试目的，我们授予ROLE_ANONYMOUS对/users端点的访问权限:

For testing purpose, we gave ROLE_ANONYMOUS access to our /users endpoint:

<intercept-url pattern="/users" method="POST" access="ROLE_ANONYMOUS"/>

但是当我们尝试通过POST发送JSON时，仍然会从服务器收到401响应.

But when we try to send a JSON by POST, we still get a 401 response from the server.

• 对于诸如Postman之类的非语言客户端，则不会发生这种情况.
• 如果禁用Spring Security过滤器，则一切正常.
• 对相同端点的GET请求也可以正常工作.

这是我们的app.config:

This is our app.config:

  angular.module('App')
    .constant('RESOURCES', (function () {
                var resource = 'http://localhost:8080';
                return {
                  USERS: resource + '/users'
                }
              })());

工厂正在执行POST方法:

And the factory doing the POST method:

  app.factory('LoginUser', ['RESOURCES', '$resource', function (RESOURCES, $resource) {
    return $resource(RESOURCES.USERS, null, {
                       add: {method: 'POST'}
                     });
  }]);

以及控制器中的注册方法:

And the signup method in the controller:

  function signup(user) {
    LoginUser.add({}, JSON.stringify(user));
  }

我们按照春季指南在服务器中安装了SimpleCORSFilter.

We have the SimpleCORSFilter setup in the server following the Spring guide.

您可以在此处查看邮递员POST和AngularJS POST之间的比较:

You can see the comparison between the postman POST and the AngularJS POST here:

标有红色的标头是自定义标头，为了避免415不支持的媒体类型，我们必须在Postman中添加标头.

The header marked in red is a custom one we have to add in Postman in order to avoid a 415 unsupported media type.

我们试图在AngularJS的POST请求中放入自定义标头，但似乎不起作用:

We tried to put custom headers in the POST request in AngularJS, but it doesn't seem to be working:

.config(function ($httpProvider) {
    $httpProvider.defaults.headers.put['Content-Type'] = $httpProvider.defaults.headers.post['Content-Type'] =
        'application/json; charset=UTF-8';
});

推荐答案

好，在查看了屏幕截图之后，我们注意到该方法是OPTIONS而不是POST.

Ok, after reviewing the screenshot, we noticed the method was OPTIONS instead of POST.

问题不在标题中(我们进行了大量检查以至于看不到明显的问题)，而是在飞行前请求中由于CORS而引起的OPTIONS问题.这是关于它的不错的文章.我们的Spring Security是为POST方法配置的，但没有为OPTIONS配置的.我们对其进行了更改，现在它就像一种魅力:

The problem was not in the headers (we were checking those so much that we weren't seeing the obvious), but in the pre-flight request OPTIONS due to CORS. Here's a nice article about it. Our Spring Security was configured for the POST method, but not for the OPTIONS. We changed it and now it works like a charm:

  <intercept-url pattern="/users" method="POST" access="ROLE_ANONYMOUS"/>
  <intercept-url pattern="/users" method="OPTIONS" access="ROLE_ANONYMOUS"/>

这篇关于AngularJS&带有ROLE_ANONYMOUS的Spring Security仍然返回401的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！