How to connect keycloak with react? No routes matched location "/undefined/protocol/openid-conn-CodePudding

Following https://scalac.io/blog/user-authentication-keycloak-1/ I have made realm and put json config in react app. But when required it does not initialize giving following error:

"No routes matched location "/undefined/protocol/openid-connect/3p-cookies/step1.html"

keyclock.js:

{
  "realm": "ReactTaskApp",
  "auth-server-url": "http://localhost:8080/",
  "ssl-required": "external",
  "resource": "react-client",
  "clientId": "react-client",
  "public-client": true,
  "confidential-port": 0
}

How can I solve this error?

CodePudding user response：

My team and I encountered the same problem, and figured out that when passing config to keycloak.js, all attribute names should be camelCased! Another thing is (if I remember correctly) that instead of authServerUrl you should pass only url as attribute name. With that saying:

{
  "realm": "ReactTaskApp",
  "url": "http://localhost:8080/",
  "sslRequired": "external",
  "resource": "react-client",
  "clientId": "react-client",
  "publicClient": true,
  "confidentialPort": 0
}