Login with keycloak and wildfly

[sensorhound-nan]

I am using wildfly 10.1.0.Final and keycloak 3.1.0.Final.

I want to use my own login page, I have created a login page with a submit button to get the token:

$('#submit').click(function(e) {
  var creds = "client_id=sensorcloud-2.2.1-SNAPSHOT&grant_type=password&client_secret=b6b4f0ec-9936-46a2-9f40-69c207e2e0f2&username=" + $('#username')[0].value +"&password=" + $('#password')[0].value;
  $.ajax({
       url: 'https://localhost:8445/auth/realms/sensorcloud-auth/protocol/openid-connect/token',
       data: creds,
       headers: {'Content-Type':'application/x-www-form-urlencoded'},
       type: 'POST',
       success: function(data){
            localStorage.setItem('currentUser', JSON.stringify(data));
            window.location.replace("https://localhost:8443/sensorcloud-2.2.1-SNAPSHOT/dashboard.html");
       },
       error: function() {
            alert("Invalid username or password");
       }
       });
  });

And it works.

But only with this code, dashboard.html doesn't have any security constraint at all,so I set up the web.xml as recommended:

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
  <display-name>SensorCloud</display-name>

  <welcome-file-list>
  <welcome-file>index.html</welcome-file>
  </welcome-file-list>

  <login-config>
  <auth-method>KEYCLOAK</auth-method>
  <realm-name>sensorcloud-auth</realm-name>
  </login-config>

  <context-param>
  <param-name>resteasy.role.based.security</param-name>
  <param-value>true</param-value>
  </context-param>

  <security-constraint>
  <web-resource-collection>
  <web-resource-name>sensorcloud-2.2.1-SNAPSHOT</web-resource-name>
  <url-pattern>/rest/*</url-pattern>
  </web-resource-collection>
  <auth-constraint>
  <role-name>user</role-name>
  <role-name>admin</role-name>
  </auth-constraint>
  <user-data-constraint>
  <transport-guarantee>CONFIDENTIAL</transport-guarantee>
  </user-data-constraint>
  </security-constraint>

  <security-constraint>
  <web-resource-collection>
  <web-resource-name>sensorcloud-2.2.1-SNAPSHOT</web-resource-name>
  <url-pattern>/index.html</url-pattern>
  <url-pattern>/help.html</url-pattern>
  <url-pattern>/register.html</url-pattern>
  <url-pattern>/login.html</url-pattern>
  </web-resource-collection>
  <user-data-constraint>
  <transport-guarantee>CONFIDENTIAL</transport-guarantee>
  </user-data-constraint>
  </security-constraint>

  <security-constraint>
  <web-resource-collection>
  <web-resource-name>sensorcloud-2.2.1-SNAPSHOT</web-resource-name>
  <url-pattern>/dashboard.html</url-pattern>  
  <url-pattern>/management.html</url-pattern>
  <url-pattern>/password.html</url-pattern>
  <url-pattern>/user.html</url-pattern>
  </web-resource-collection>
  <auth-constraint>
  <role-name>user</role-name>
  <role-name>admin</role-name>
  </auth-constraint>
  <user-data-constraint>
  <transport-guarantee>CONFIDENTIAL</transport-guarantee>
  </user-data-constraint>
  </security-constraint>

  <security-constraint>
  <web-resource-collection>
  <web-resource-name>sensorcloud-2.2.1-SNAPSHOT</web-resource-name>
  <url-pattern>/admin.html</url-pattern>
  </web-resource-collection>
  <auth-constraint>
  <role-name>admin</role-name>
  </auth-constraint>
  <user-data-constraint>
  <transport-guarantee>CONFIDENTIAL</transport-guarantee>
  </user-data-constraint>
  </security-constraint>

  <security-role>
  <role-name>admin</role-name>
  </security-role>
  <security-role>
  <role-name>user</role-name>
  </security-role>
</web-app>

Some public pages can be accessed by anyone like index.html, login.html. And some pages should be accessed only by user and admin, like dashboard.html, and admin.html should only be accessed by admin user.

And in my keycloak realm client setting, for client sensorclout-2.2.1-SNAPSHOT, I have redirect url as

https://localhost:8443/sensorcloud-2.2.1-SNAPSHOT/*

But every time when I try to go to dashboard.html, I will be redirect the keycloak default login page. I want to be redirect to my customized login page.

How can I achieve this?

Thanks