Question

很抱歉还有关于Angular和CORS的另一个问题，但我无法确定问题所在。我的基本设置是一个纯粹的角度独立网站，因此没有Express或任何服务器端组件，它与另一台服务器上的基于Java的API进行通信。 API使用JAX-RS构建，并存在于JBoss 7.1.3应用程序服务器中。我可以访问angular和java的代码。

在API方面，使用下面显示的流行的thetransactioncompany CORS过滤器启用CORS。

<filter>
    <filter-name>CORS</filter-name>
    <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
    <init-param>
        <param-name>cors.supportedMethods</param-name>
        <param-value>GET, POST, HEAD, PUT, DELETE, OPTIONS</param-value>
    </init-param>
    <init-param>
        <param-name>cors.supportedHeaders</param-name>
        <param-value>Origin, Accept, Content-Type, X-Requested-With, Cookie,content-type</param-value>
    </init-param>
</filter>
<filter-mapping>
    <filter-name>CORS</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

API的工作方式是向返回令牌的端点提供用户名和密码，然后在每个后续请求的Authorization标头中包含此令牌。该过程的第一部分工作正常，我可以提供有效的凭据并接收令牌，但随后任何后续请求都无法正常工作。所以在我的Angular服务中，我有以下登录方法，它获取一个令牌，然后尝试获取当前登录用户。

login: function(username, password){

        var deferred = $q.defer();

        $http({
            method: 'POST',
            url: 'http://localhost:8080/website-api/rest/account/token',
            headers: {'Content-Type': 'application/x-www-form-urlencoded', 'Accept': 'application/json'},
            transformRequest: function(obj) {
                var str = [];
                for(var p in obj){
                    str.push(encodeURIComponent(p) + '=' + encodeURIComponent(obj[p])); 
                }
                return str.join('&');
            },
            data: {username: username, password: password }
        })
        .success(function(token) {

            $log.info(token.jwt);

            var requestConfig = {
                headers: {
                    'Authorization': token.jwt,
                    'Accept': 'application/json',
                    'X-Testing': 'Testing'
                }
            };

            $http.get('http://localhost:8080/website-api/rest/users/current', requestConfig)
                .success(function(user) {

                    $log.info('Retrieved User');
                    user.sessionToken = token.jwt;
                    deferred.resolve(user);

                })
                .error(function(data, status, headers, config) {

                    $log.info(data);
                    $log.info(status);
                    $log.info(headers);
                    $log.info(config);
                });

        })
        .error(function(data, status, headers, config) {

            $log.info(data);
            $log.info(status);
            $log.info(headers);
            $log.info(config);
        });

        return deferred.promise;
    }

第一个请求完美无缺，第二个请求失败并显示错误：

XMLHttpRequest cannot load http://localhost:8080/website-api/rest/users/current. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:9000' is therefore not allowed access.

我无法弄清楚API上的CORS过滤器的设置是否是我的问题的原因，或者是从Angular发送请求时我没有正确完成的事情。我怀疑它是Angular，因为我可以使用第三方服务Postman和Hurl.it来测试我的API端点，并按照预期返回用户对象。

任何帮助将不胜感激！

Answer 1

根据阅读此post的预感，我注意到我的Content-Type不仅在我接受的标题列表中定义了两次，但我没有{{1}设置为允许的标头。 CORS过滤器拒绝任何包含不允许的标头的传入请求，从而导致403错误。

具有授权标头的AngularJS CORS

1 个答案: