I trying to setup Keycloak on my server. Keycloak is behind my Træfik V2 reverse proxy.
I tried all version between 13.0.0 and 10.0.2.
From 11.0.0 to latest
I got this issue, when I attempt to navigate to /auth/admin
:
Refused to frame 'http://keycloak.docker.localhost/' because it violates the following Content Security Policy directive: "frame-src 'self'"
Here is the source code of the page:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="robots" content="noindex, nofollow">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/auth/resources/nuum7/admin/keycloak/img/favicon.ico">
<link href="/auth/resources/nuum7/common/keycloak/node_modules/patternfly/dist/css/patternfly.min.css" rel="stylesheet" />
<link href="/auth/resources/nuum7/common/keycloak/node_modules/patternfly/dist/css/patternfly-additions.min.css" rel="stylesheet" />
<link href="/auth/resources/nuum7/common/keycloak/node_modules/select2/select2.css" rel="stylesheet" />
<link href="/auth/resources/nuum7/common/keycloak/lib/angular/treeview/css/angular.treeview.css" rel="stylesheet" />
<link href="/auth/resources/nuum7/common/keycloak/node_modules/text-security/text-security.css" rel="stylesheet" />
<link href="/auth/resources/nuum7/admin/keycloak/css/styles.css" rel="stylesheet" />
<script type="text/javascript">
var authServerUrl = 'http://keycloak.docker.localhost/auth';
var authUrl = 'http://keycloak.docker.localhost/auth';
var consoleBaseUrl = '/auth/admin/master/console/';
var resourceUrl = '/auth/resources/nuum7/admin/keycloak';
var masterRealm = 'master';
var resourceVersion = 'nuum7';
</script>
<!-- Minimized versions (for those that have one) -->
<script src="/auth/resources/nuum7/common/keycloak/node_modules/jquery/dist/jquery.min.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/select2/select2.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular/angular.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-resource/angular-resource.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-route/angular-route.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-cookies/angular-cookies.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-sanitize/angular-sanitize.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-translate/dist/angular-translate.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-translate-loader-url/angular-translate-loader-url.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/angular-ui-select2/src/select2.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/common/keycloak/node_modules/autofill-event/autofill-event.js"></script>
<!-- Libraries not managed by yarn -->
<script src="/auth/resources/nuum7/common/keycloak/lib/angular/ui-bootstrap-tpls-0.11.0.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/lib/angular/treeview/angular.treeview.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/lib/fileupload/angular-file-upload.min.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/lib/filesaver/FileSaver.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/lib/ui-ace/min/ace.js"></script>
<script src="/auth/resources/nuum7/common/keycloak/lib/ui-ace/ui-ace.min.js"></script>
<script src="http://keycloak.docker.localhost/auth/js/keycloak.js?version=nuum7" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/app.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/controllers/realm.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/controllers/clients.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/controllers/users.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/controllers/groups.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/controllers/roles.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/loaders.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/services.js" type="text/javascript"></script>
<!-- Authorization -->
<script src="/auth/resources/nuum7/admin/keycloak/js/authz/authz-app.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/authz/authz-controller.js" type="text/javascript"></script>
<script src="/auth/resources/nuum7/admin/keycloak/js/authz/authz-services.js" type="text/javascript"></script>
</head>
<body data-ng-controller="GlobalCtrl" data-ng-cloak data-ng-show="auth.user">
<nav class="navbar navbar-default navbar-pf" role="navigation" data-ng-include data-src="resourceUrl + '/partials/menu.html'">
</nav>
<div class="container-fluid">
<div class="row">
<div data-ng-view id="view"></div>
</div>
</div>
<div class="feedback-aligner" data-ng-show="notification.display">
<div class="alert alert-{{notification.type}} alert-dismissable">
<button type="button" class="close" data-ng-click="notification.remove()" id="notification-close">
<span class="pficon pficon-close"/>
</button>
<span class="pficon pficon-ok" ng-show="notification.type == 'success'"></span>
<span class="pficon pficon-info" ng-show="notification.type == 'info'"></span>
<span class="pficon pficon-warning-triangle-o" ng-show="notification.type == 'warning'"></span>
<span class="pficon pficon-error-circle-o" ng-show="notification.type == 'danger'"></span>
<strong>{{notification.header}}</strong> {{notification.message}}
</div>
</div>
<div id="loading" class="loading">Loading...</div>
</body>
</html>
We can see that the script in top and keycloak.js
are prefixed with http://keycloak.docker.localhost
, where all others scripts/ressources not.
Here is my docker-compose (filled with shitty login, for test):
version: '3.3'
services:
postgres:
image: postgres:11.10-alpine
volumes:
- ./data:/var/lib/postgresql/dat
environment:
POSTGRES_DB: keycloak
POSTGRES_USER: keycloak
POSTGRES_PASSWORD: auie
keycloak:
image: jboss/keycloak:13.0.0
environment:
DB_VENDOR: POSTGRES
DB_ADDR: postgres
DB_DATABASE: keycloak
DB_USER: keycloak
DB_SCHEMA: public
DB_PASSWORD: auieauie
KEYCLOAK_USER: admin
KEYCLOAK_PASSWORD: auieauie
PROXY_ADDRESS_FORWARDING: true
KEYCLOAK_HOSTNAME: keycloak.docker.localhost
# Uncomment the line below if you want to specify JDBC parameters. The parameter below is just an example, and it shouldn't be used in production without knowledge. It is highly recommended that you read the PostgreSQL JDBC driver documentation in order to use it.
#JDBC_PARAMS: "ssl=true"
volumes:
- ./realm-config:/opt/jboss/keycloak/realm-config
- ./database:/opt/jboss/keycloak/standalone/data
depends_on:
- postgres
networks:
- proxy
labels:
- 'traefik.enable=true'
- 'traefik.http.routers.keycloak.rule=Host(`keycloak.docker.localhost`)'
- 'traefik.http.routers.keycloak.tls=true'
- 'traefik.http.services.keycloak.loadbalancer.server.port=8080'
- "traefik.http.routers.keycloak.tls.certresolver=le"
restart: unless-stopped
healthcheck:
disable: true
environment:
- TZ=Europe/Paris
From version 10.0.2
when I access to /auth/admin
, I get the following error: Invalid parameter: redirect_uri
Does anyone have encounter this issue ?
Are the developers aware of this problem ?