Browser looping when using `keycloak-js` v11
See original GitHub issueDescribe the bug
I’m facing a strange issue.
When navigating into my http://localhost:3000/#/hom, the provider create a infinite loop. It keep looping from http://localhost:3000/#/home to the following url :
http://localhost:3000/#/home&state=30692c6b-e9e0-407a-b522-e0bdec324d66&session_state=e1ec5e6e-463c-43dc-9f7e-e7170a4f7422&code=7f5c9f74-efd2-4014-a7b6-819f06647cda.e1ec5e6e-463c-43dc-9f7e-e7170a4f7422.300185e4-3ad6-4e7d-8967-f9a4c617cad8
When using the keycloakProvider and Keycloak-js 11.0.2
To Reproduce Steps to reproduce the behavior:
- Install keycloak 11.0.2
- Install js dependencies to keycloak 11.0.2 (keycloak-js v11.0.2)
- configure your keycloak and your project as expected
- Go to http://localhost:3000/#/ (or /home)
- See looping behavior on the application
Expected behavior Init the component.
Desktop (please complete the following information):
- OS: Ubuntu 20.04.1 LTS (Focal Fossa)
- Browser Chrome / Firefox
- Version Chrome 85
Additional information: I suspect that the keycloak.init() return something not expected by the provider and that cause a new request to initialize the keycloak instance again and again.
Issue Analytics
- State:
- Created 3 years ago
- Reactions:5
- Comments:44 (4 by maintainers)
Top Related StackOverflow Question
Found a solution for the issue here when upgrading to React 18: https://github.com/react-keycloak/react-keycloak/issues/182
Strict mode now causes components to render twice in development to ensure reusable state. This probably causes the component to reload for some reason. https://reactjs.org/docs/strict-mode.html
Remove or move the StrictMode to solve infinite reloading.
The issue appears to be related to
React.StrictModeas well. By moving theReactKeycloakProvider.../>outside the<React.StrictMode.../>my problem was solved.