GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → dasniko → Keycloak Reactjs Demo

dasniko / Keycloak Reactjs Demo

Licence: mit
Demo for React.js and Keycloak SSO integration.

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

reactreactjssso

Projects that are alternatives of or similar to Keycloak Reactjs Demo

Cas Sso Samples
CAS单点登录案例。整合了CAS OAuth2、Apache Shiro、Spring Security等
Stars: ✭ 60 (-59.18%)
Mutual labels:  sso
Zitadel
ZITADEL - Cloud Native Identity and Access Management
Stars: ✭ 105 (-28.57%)
Mutual labels:  sso
Hydra
OpenID Certified™ OpenID Connect and OAuth Provider written in Go - cloud native, security-first, open source API security for your infrastructure. SDKs for any language. Compatible with MITREid.
Stars: ✭ 11,884 (+7984.35%)
Mutual labels:  sso
Testcontainers Keycloak
A Testcontainer implementation for Keycloak SSO.
Stars: ✭ 62 (-57.82%)
Mutual labels:  sso
Svelte Social Auth
Social Auth for Svelte v3
Stars: ✭ 86 (-41.5%)
Mutual labels:  sso
Cas Server Webapp
CAS Server 4.0二次开发。添加登录错误三次及以上验证码校验、用户登录数据库认证、CAS Server REST等
Stars: ✭ 113 (-23.13%)
Mutual labels:  sso
Auth0 Drupal
Auth0 Drupal Plugin - Single Sign On, Social Login, SAML and AD/LDAP Integration, User Management, Community Driven, Open Source
Stars: ✭ 42 (-71.43%)
Mutual labels:  sso
Djangosaml2
A maintenance fork of the original and no longer maintained djangosaml2 library.
Stars: ✭ 143 (-2.72%)
Mutual labels:  sso
Oneplatform
onePlatform定位是企业级应用网关，提供提供服务路由、SSO、统一认证授权、统一日志、全局事件以及模块化管理等基础能力。基于Spring cloud、开箱即用、无额外学习成本、无缝对接老系统。→提供配套视频教程(Q群: 61859839)
Stars: ✭ 105 (-28.57%)
Mutual labels:  sso
Cipheridaas
CipherIDaaS —— Open-source IDaaS/IAM product by CipherChina , Hangzhou .
Stars: ✭ 121 (-17.69%)
Mutual labels:  sso
Saml2.authentication.core
A SAML 2.0 middleware for ASP.NET Core
Stars: ✭ 66 (-55.1%)
Mutual labels:  sso
Vouch Proxy
an SSO and OAuth / OIDC login solution for Nginx using the auth_request module
Stars: ✭ 1,239 (+742.86%)
Mutual labels:  sso
Xxl Sso
A distributed single-sign-on framework.（分布式单点登录框架XXL-SSO）
Stars: ✭ 1,635 (+1012.24%)
Mutual labels:  sso
Php
PHP 文章集锦，浮点数搞定度运算、签名验证、单点登录、安全防御、缓存技术、RPC、Composer ...
Stars: ✭ 61 (-58.5%)
Mutual labels:  sso
Smart Sso
springboot SSO 单点登录，OAuth2实现，支持App登录，支持分布式
Stars: ✭ 1,777 (+1108.84%)
Mutual labels:  sso
Docker Swarm Cookbook
A large collection of recipes for a complete, self-hosted Docker Swarm stack including Traefik v2 and SSO/Auth
Stars: ✭ 49 (-66.67%)
Mutual labels:  sso
Cas Webapp Docker
Apereo CAS Server web application running inside a docker container.
Stars: ✭ 107 (-27.21%)
Mutual labels:  sso
Pi
Multi-tenant application development engine for cloud ready SaaS platform.
Stars: ✭ 145 (-1.36%)
Mutual labels:  sso
Cli
🧰 A zero trust swiss army knife for working with X509, OAuth, JWT, OATH OTP, etc.
Stars: ✭ 2,151 (+1363.27%)
Mutual labels:  sso
Awsaml
Awsaml is an application for providing automatically rotated temporary AWS credentials.
Stars: ✭ 120 (-18.37%)
Mutual labels:  sso
View All Similar Projects ➔

Keycloak React.JS Demo

Demo for React.JS and Keycloak SSO integration.

YouTube videos

There are three videos on YouTube about this demo repository and how to integrate your React.js based application with Keycloak:

Part 1: Configuration & Usage, w/o 3rd party libs


https://youtu.be/q50LxyGtEf0

Part 2: Conditional rendering of components


https://youtu.be/zIoWxY3Xhnw

Part 3: React Router Integration, depending on Keycloak Roles


https://youtu.be/es8sf8D7UyQ

Please check out also my entire Youtube Channel with various videos on Keycloak and stuff around:

Silent Check-SSO feature

This demo comes now with the silent check-sso feature, introduced in version 8.x of the Keycloak JavaScript adapter. Therefor, see index.js, silent-check-sso.html and of course the official Keycloak docs of the JavaScript adapter.

(Silent check-sso is not the same as silent refresh for implicit flow! Implicit flow is today considered as insecure and shouldn't be used anymore. Instead, use standard authorization code flow with PKCE, which is also supported by Keycloak since version 7.x.)

Prerequisites

  • based on React version >= 16.8 (using hooks) and create-react-app
  • Keycloak server must be at least version 9.x (no more legacy Keycloak promise API, only native promise API)

!!! Important Notice !!!

This demo is just for showing one possibility on how to configure the app when using Keycloak and it requires a certain knowledge about Keycloak SSO (installation, operation, configuration), see http://www.keycloak.org.

Backend service

For convenience, I provide a backend service running at the location specified in setupProxy.js file.

However, there's also a swagger spec (backend-swagger-spec.yml) providing the API of the needed backend, so you can spin up a service on your own. The URLs in the securityDefinitions section shows my local Keycloak setup, you have to adjust this possibly! (Also don't forget to adjust the host/port in the setupProxy.js file, if you run your service on ohters than default.)

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].