Keycloak Angular Integration Guide | OAuth 2 + Express Server
HTML-код
- Опубликовано: 26 фев 2024
- keycloak custom login page | keycloak authentication flow | keycloak nodejs | keycloak setup | keycloak angular | keycloak authorization | keycloak docker | keycloak saml | keycloak openid connect | keycloak tutorial | OAuth 2 | express server | keycloak node js example
Github Repo-github.com/dnyaneshwargiri/ke...
Docker installation- www.keycloak.org/getting-star...
Timestamp-
Keycloak Installation on Docker 2:30
Keycloak Setup 4:30
Angular Auth Guard using Keycloak 13:13
Keycloak Login Page 22:30
Get User Profile Data 24:09
Authorization Header & Bearer Token 29:21
Secure Express API Using Bearer Token 32:08
Keycloak Custom Theme 37:07
Keycloak Custom Login Page 37:55
OpenId Connect with External IAM 38:28
Related Videos-
• Implement google sign ...
• How to Integrate Payme...
• Template Driven Forms ...
• Integrate Google Calen...
• Sign in With Google | ...
Topics Covered-
keycloak angular,
openid connect,
oauth2 explained,
oauth2 authorization code flow,
keycloak nodejs,
keycloak nodejs example,
keycloak node js express,
keycloak angular integration,
keycloak angular login,
keycloak angular tutorial,
keycloak angular example
keycloak theme angular,
keycloak installation mac,
keycloak installation,
keycloak installation docker,
docker desktop tutorial,
docker desktop mac,
angular login authentication with api,
angular login page with jwt token,
angular login form validation example,
angular login page,
saml authentication explained,
oauth2 explained,
keycloak openid connect,
angular 17,
angular standalone app,
angular standalone component,
netflix clone angular,
keycloak custom theme,
keycloak custom login page angular
#keycloak #oauth2 #angular #authorization #nodejs #expressjs #keycloak #angulartutorial #apisecurity 
Наука
thanks man, your video really helped me
Glad I could help 🙂
Thank you very mauch, this video helped me in my problem who I tired for the last two days. Greetings from Poland
Glad to know it ☺️ love to Poland 🇵🇱
Thanks, that was really good explained keep going
Thank you very much 💙
its an amazing video can u please do a video about authentification with keycloak spring boot angular thanks
Good suggestion, I really liked it 🙂 will try if time allows.
thank you very much, that was very detailed. but how can the configuration in angular look like when the client authentication switch is on. because it works as long as that switch is off?
That toggle is for custom authorization services, I recommend below doc to understand it.
section- Enabling authorization services
www.keycloak.org/docs/latest/authorization_services/index.html
Hi, thanks for the tutorial, I have a problem, when I create a new user I cannot log in with it, except if I add the 'admin' role to the group that the user belongs to.
It depends on what role you set for client app. Ideally it is be possible to login user with whatever role you set. Please read more
www.keycloak.org/docs/latest/authorization_services/#_permission_overview
Hi,
How can i set the client_secret value defined on the Keycloak side in our Angular project?
Technically you can do it in so many ways, most secure one I prefer is to set it as process environment variable so it doesn't show to anywhere in source code in browser.
Let me know if it doesn't answer your question, I can explain further.
Hi, and thanks for your example project. But I have a problem with the error :
ReferenceError: window is not defined
How did you resolve this error?
I've looked at your example project and I can't find anything to resolve this error. Thanks in advance!
Could give context exactly where it is appearing?
@@brogrammers i have the same problem but with 'document is not defined', that happens when i do 'ng serve' the log is: ERROR ReferenceError: document is not defined
at Keycloak (C:\Users\mauza\Desktop\intap\Angular\Angular-Front
ode_modules\keycloak-js\dist\keycloak.mjs:41:19)
at _KeycloakService.eval (C:\Users\mauza\Desktop\intap\Angular\Angular-Front
ode_modules\keycloak-angular\fesm2022\keycloak-angular.mjs:129:22)
at Generator.next ()
at eval (C:/Users/mauza/Desktop/intap/Angular/Angular-Front/.angular/vite-root/Angular-Front/chunk-OGTRFHQR.mjs:83:61) [...]
Can you please create issue over my GitHub repo tagging me in. In that way it becomes easy for me to actually fix it rather than writing here in RUclips comments. Hope you understand 🙂
This is amazing, but why did you add the backendserver url in the callback,this was only to use same client_id ?
Because you can also handle authentication flow in backend app, with that configuration it was meant to inform that technical feasibility :)
@@brogrammers thank you for the reply,i just was thinking about the server flow should have a client with grant_type client credentials?right
Yes
How to solve ReferenceError: window is not defined ???
github.com/dnyaneshwargiri/keycloak-angular-integration/issues/2
@@brogrammers yea, very cool guy who opened that issue ;-)
Yes, indeed ✌️