<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252"></head><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; color: rgb(0, 0, 0); font-size: 14px; font-family: Calibri, sans-serif;"><div><div>Hi,</div><div><br></div><div>Cors headers missing during login procedure of keycloak</div><div><br></div><div><br></div><div>===============================</div><div>Step 1 - Prepare keycloak realm:</div><div>===============================</div><div><br></div><div>Create a simple keycloak realm for testing, </div><div><br></div><div>===============================</div><div>Step 2 - Create a user</div><div>===============================</div><div><br></div><div>Add a user and a client to the realm</div><div>The client should be configured as follows:</div><div><br></div><div><span class="Apple-tab-span" style="white-space:pre"> </span>Client Protocol <span class="Apple-tab-span" style="white-space:pre"> </span>openid-connect</div><div><span class="Apple-tab-span" style="white-space:pre"> </span></div><div><span class="Apple-tab-span" style="white-space:pre"> </span>Access Type<span class="Apple-tab-span" style="white-space:pre"> </span>public</div><div><br></div><div><span class="Apple-tab-span" style="white-space:pre"> </span>Valid redirect uri's: <span class="Apple-tab-span" style="white-space:pre"> </span>http://localhost/*</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>http://localhost</div><div><span class="Apple-tab-span" style="white-space:pre"> </span></div><div><span class="Apple-tab-span" style="white-space:pre"> </span>Web origins:<span class="Apple-tab-span" style="white-space:pre"> </span>http://localhost/*</div><div> http://localhost</div><div><br></div><div>===============================<span class="Apple-tab-span" style="white-space:pre"> </span></div><div>Step 3 - Create test application on tomcat</div><div>===============================</div><div><br></div><div>On a given tomcat server (I'm using localhost for this example) add 2 web applications:</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>app1 with a simple index.html</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>cors with a simple test.txt with the content "Some data"</div><div><br></div><div>The following url's are now available:</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>http://localhost/app1/index.html</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>http://localhost/cors/test.txt</div><div><br></div><div>In http://localhost/app1/index.html create javascript which loads data from http://localhost/cors/test.txt</div><div><br></div><div>If you go to http://localhost/app1/index.html now, a GET will be performed to http://localhost/cors/test.txt and the data is displayed </div><div><br></div><div><br></div><div>===============================</div><div>Step 4 - Adding keycloak to the applications</div><div>===============================</div><div><br></div><div>Add keycloak configuration on "app1".</div><div><br></div><div><br></div><div>Add keycloak configuration on "cors"</div><div>Additionally, add </div><div>"enable-cors": "true" </div><div>to the json file.</div><div><br></div><div>===============================</div><div>Step 5 - Log in to app1</div><div>===============================</div><div><br></div><div>If you log in to app1 in a new browser the data from app "cors" will not be loaded. The following error will be displayed in the console of your browser (using chrome)</div><div><br></div><div>XMLHttpRequest cannot load http://localhost-auth:8080/auth/realms/test/protocol/openid-connect/auth?re…lient%2Ftest.txt&state=6%2Fa1e9817b-7f9b-4d30-ab4e-17637c9d190a&login=true. </div><div>No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.</div><div><br></div><div><br></div><div>If it loaded the data, make sure that you're logged out, or try it in private browsing mode.</div><div><br></div><div><br></div><div>===============================</div><div>Expected result</div><div>===============================</div><div><br></div><div>We expected "Access-Control-Allow-Origin" to be set to the "Web origins", allowing for cross-application requests without editing existing applications.</div></div><div><br></div><div><p class="MsoNormal" style="font-size: 11pt; margin: 0cm 0cm 0.0001pt;"><span lang="NL">Met vriendelijke groet / Yours sincerely / Mit freundlichen Grüßen / Très cordialement,<o:p></o:p></span></p><p class="MsoNormal" style="font-size: 11pt; margin: 0cm 0cm 0.0001pt;"><br></p><p class="MsoNormal" style="font-size: 11pt; margin: 0cm 0cm 0.0001pt;">Henk Laracker</p></div></body></html>