Отсутствует заголовок Keycloak Нет заголовка Access-Control-Allow-Origin.

Я интегрировал keycloak с угловым приложением. В принципе, оба интерфейса и бэкэнд находятся на разных серверах. Приложение для приложения работает на apache tomcat. 8. Приложение Frontend работает в папке с приветственным содержимым 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

Ошибка на веб-консоли.

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.

Фильтр Корса на бэкэнд

@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() {
    }
}

Ответы

Ответ 1

Я сражался с KeyCloak и CORS, и все это в течение двух недель, и это мое решение (для keyclayak 3.2.1):

Все о настройке сервера KeyCloak. Кажется, что WebOrigin вашего Королевства должен быть

Только одно происхождение "*".

Это все, что мне нужно.

Если вы введете свой сервер как WebOrigin, проблема начнется. Когда вы вызываете keycloak.init в JavaScript, keycloak не генерирует заголовки CORS, поэтому вам нужно настроить их вручную, и как только вы это сделаете, и вызовите keycloak.getUserInfo после успешного init - вы получите двойные заголовки CORS, что не позволил.

Где-то в глубине списков рассылки keycloak указано, что вам нужно установить enable-cors = true в свой keycloak.json, но об этом на keycloak.gitbooks.io ничего нет. Так что, похоже, это не так.

Они также не упоминают CORS при описании адаптеров JavaScript и Node.Js, и я не знаю, почему, кажется, не важно вообще.

Также кажется, что вы не должны прикасаться к конфигурации WildFly для предоставления заголовков CORS.

Кроме того, CORS в OIDC - это специальная функция KeyCloak (а не ошибка).

Надеюсь, этот ответ вам поможет.

Ответ 2

Важно отметить, что при настройке вашего веб-источника на "*" открывается зияющее отверстие безопасности. Он позволяет любому скрипту из любого домена делать запросы от имени пользователя, в пределах этого пользовательского браузера.

Всякий раз, когда вы обнаруживаете, что отключите функцию безопасности таким образом, вам нужно учитывать, почему существует функция безопасности.

См. Раздел 8.1.1 документов Keycloak

Ответ 3

Решением, которое работало для меня, было задание URL-адреса веб-происхождения (моего клиента, а не области), например: от http://localhost:3000/ до http://localhost:3000 (обратите внимание на отсутствие / в конце). Таким образом, вы не открываете его для всех URL, используя *.

Ответ 4

Вы ответили на свой вопрос, добавив WebOrigin как * на уровне клиента (не на уровне Realm!), Который работал на вас, но в моем случае это не так. Фактически, удаление * было трюком для меня, потому что KC дважды отправлял заголовки CORS - удаляя его, разделил его на один раз...

Благодаря вашему ответу, я, к счастью, нашел ответ на мои проблемы...

Мы все согласны с тем, что документация КК по меньшей мере очень бедна.

Это написано для чайников, но... мы не манекены, ни тема...

Это не объясняет технические детали. Например, каковы ответы от конечных точек. Поиск в Интернете (две недели) дает немного - но почему он не изложен в документации?

Один пример. Но у меня есть несколько...

Можем ли мы помочь с документацией?

Ответ 5

Столкнулась с этой же проблемой, работая с Angular 6, Spring Boot для веб-служб REST и Keycloak.

Адрес клавиатуры: KEYCLOAK
Angular 6 Адрес приложения: ANGULAR_APP
Два REST WS с поддержкой Keycloak и Spring Autoconfiguration: AA, BB

Поток был: Угловой запрос приложения (GET) AA, запрос AA (GET) BB

Использование ошибки XMLHttpRequest было чем-то вроде: Невозможно загрузить AA. Ответ на запрос перед полетом не проходит проверку контроля доступа. Нет заголовка "Access-Control-Allow-Origin" на запрошенном ресурсе. Поэтому Origin 'ANGULAR_APP' не допускается.

Использование Observable from Angular было: Не удалось загрузить AA: перенаправление с "BB" на "KEYCLOAK" было заблокировано политикой CORS: заголовок "Access-Control-Allow-Origin" присутствует на запрошенном ресурсе. Поэтому Origin 'ANGULAR' не допускается.

Пробовал с веб-истоками: * без решения

Никогда не знал, почему Keycloak делает это перенаправление, что вызвало проблему

Проблема волшебным образом исчезла, когда я переключил безопасность в сервисе AA с Keycloak + Autoconfigure на Keycloak + Spring Security в соответствии с: https://developers.redhat.com/blog/2017/05/25/easily-secure-your-spring-boot- приложения-с-keycloak/

Из-за этого потерял много дней сна. Просто оставив это на случай, если кто-то столкнется с чем-то похожим.

Ответ 6

У меня была та же проблема, и в моем случае это было вызвано использованием объекта параметров при создании js-адаптера keycloak, где URL-адрес сервера аутентификации был неверно установлен на http вместо https:

const keycloak = Keycloak({
    url: 'http://my-keycloak-auth-server/auth',
    realm: 'myRealm',
    clientId: 'myClient'
});

но правильно было

const keycloak = Keycloak({
    url: 'https://my-keycloak-auth-server/auth',
    realm: 'myRealm',
    clientId: 'myClient'
});