Keycloak角度不存在“ Access-Control-Allow-Origin”标头

Question

我已经集成了带角度应用程序的按键斗篷。基本上，前端和后端都在不同的服务器上。后端应用程序在Tomcat
8上运行。前端应用程序在JBoss欢迎内容文件夹上运行。

角度配置

angular.element(document).ready(function ($http) {
    var keycloakAuth = new Keycloak('keycloak.json');
    auth.loggedIn = false;
    keycloakAuth.init({ onLoad: 'login-required' }).success(function () {
        keycloakAuth.loadUserInfo().success(function (userInfo) {
            console.log(userInfo);  
        });
        auth.loggedIn = true;
        auth.authz = keycloakAuth;
        auth.logoutUrl = keycloakAuth.authServerUrl + "/realms/app1/protocol/openid-connect/logout?redirect_uri=http://35.154.214.8/hrms-keycloak/index.html";
        module.factory('Auth', function() {
            return auth;
        });
        angular.bootstrap(document, ["themesApp"]);
    }).error(function () {
            window.location.reload();
        });

});
module.factory('authInterceptor', function($q, Auth) {
    return {
        request: function (config) {
            var deferred = $q.defer();
            if (Auth.authz.token) {
                Auth.authz.updateToken(5).success(function() {
                    config.headers = config.headers || {};
                    config.headers.Authorization = 'Bearer ' + Auth.authz.token;
                    deferred.resolve(config);
                }).error(function() {
                        deferred.reject('Failed to refresh token');
                    });
            }
            return deferred.promise;
        }
    };
});
module.config(["$httpProvider", function ($httpProvider)  {
    $httpProvider.interceptors.push('authInterceptor');
}]);

请求标题

Accept:*/*
Accept-Encoding:gzip, deflate
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:authorization
Access-Control-Request-Method:GET
Connection:keep-alive
Host:35.154.214.8:8080
Origin:http://35.154.214.8
Referer:http://35.154.214.8/accounts-keycloak/
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36

Web控制台错误。

XMLHttpRequest cannot load http://35.154.214.8:8080/company/loadCurrencyList. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://35.154.214.8' is therefore not allowed access.

后端的Cors筛选器

@Component
public class CORSFilter implements Filter {
    static Logger logger = LoggerFactory.getLogger(CORSFilter.class);

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

    @Override
    public void doFilter(ServletRequest request, ServletResponse res,
            FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Methods", "*");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "*");
        chain.doFilter(request, response);
    }

    public void destroy() {
    }
}

Answer 1

我与KeyCloak和CORS以及所有这些都进行了大约两个星期的斗争，这是我的解决方案（针对keycloak 3.2.1）：

这全部与配置KeyCloak服务器有关。似乎，您的领域的WebOrigin需要

*

只有一个原点“ *”。

仅此而已，这是我所需要的。

如果以WebOrigin输入服务器，则麻烦开始了。当您在JavaScript中调用keycloak.init时，keycloak不会生成CORS标头，因此您必须手动对其进行配置，并在成功初始化后立即调用keycloak.getUserInfo-
您将获得双CORS标头，而不是允许的。

在keycloak邮件列表的深处指出，您需要在keycloak.json中设置enable-cors =
true，但是keycloak.gitbooks.io上没有任何相关设置。因此，似乎并非如此。

他们在描述JavaScript和Node.Js适配器时也没有提到CORS，而且我也不知道为什么，这似乎一点都不重要。

似乎也不应触摸WildFly配置来提供CORS标头。

此外，OIDC中的CORS是KeyCloak的一项特殊功能（不是bug）。

希望这个答案对您有帮助。