oidc client

@ axa-fr / oidc-client

• À propos
• Commencer
• Exécutez les démos
• Comment ça marche
• Packages
  • @axa-fr/oidc-client
  • @axa-fr/react-oidc
  • @axa-fr/svelte-oidc : nous recherchons un contributeur
  • @axa-fr/vue-oidc : Nous recherchons un contributeur
  • @axa-fr/angular-oidc : Nous recherchons un contributeur
• FAQ
• Migrations
• Contribuer

À propos

@ AXA-FR / OIDC-CLIENT La bibliothèque la plus légère et le secrest pour gérer l'authentification avec OpenID Connect (OIDC) et le protocole OAuth2. Il est compatible avec tous les fournisseurs OIDC. @ AXA-FR / OIDC-CLIENT est une bibliothèque JavaScript pure. Il fonctionne avec n'importe quel framework JavaScript ou bibliothèque. @ AXA-FR / REACT-OIDC est pour React (compatible Next.js, etc.), nous nous attendons bientôt à en fournir un pour Vue , Angular et Svelte .

Démos:

• Essayez la démonstration React sur https://black-rock-0dc6b0d03.1.azurestatichapps.net/ (la plus avancée)
• Essayez la démo pure javascript sur https://icy-glacier-004ab4303.2.azurestaticApps.net/

@ AXA-FR / OIDC-Client est:

• Sécurisé :
  • Avec une preuve de possession (DPOP).
  • Avec l'utilisation du service de service, vos jetons (Refresh_token et / ou Access_token) ne sont pas accessibles au code client JavaScript (si vous suivez les bonnes pratiques de la section FAQ )
  • OIDC en utilisant la subvention d'identification du code côté client avec PKCE uniquement
• Léger : la taille déballée sur NPM est de 274 Ko , 61.1kB , minifiée + gzipied 16.8kB PKG Statistiques via bundlephobia.com
• Simple
  • Refresh_token et Access_token sont rafraîchis automatiquement en arrière-plan
  • Avec l'utilisation du service du service, vous n'avez pas besoin d'injecter le fichier Access_token Access_token, vous n'avez qu'à configurer
• Authentification multiple :
  • Vous pouvez vous authentifier plusieurs fois au même fournisseur avec une portée différente (par exemple, vous pouvez acquérir une nouvelle portée de «paiement» pour un paiement)
  • Vous pouvez vous authentifier à plusieurs fournisseurs différents dans le même site Web Spa (application à page unique)
• Flexible :
  • Travaillez avec le travailleur de service (plus sécurisé) et sans pour le navigateur plus âgé (moins sécurisé).
  • Vous pouvez désactiver le service de service si vous le souhaitez (mais moins sécurisé) et simplement utiliser SessionStorage ou LocalStorage.

Fonctionne parfaitement bien avec:

• Auth0
• Duende Identity Server
• Serveur d'identité 4
• Annonce azure
• Google
• AWS
• Keycloak
• etc., tous les fournisseurs OIDC

Commencer

Commencer avec @ AXA-FR / OIDC-CLIENT

npm install @axa-fr/oidc-client --save

# To install or update OidcServiceWorker.js file, you can run
node ./node_modules/@axa-fr/oidc-client/bin/copy-service-worker-files.mjs public

# If you have a "public" folder, the 2 files will be created :
# ./public/OidcServiceWorker.js <-- will be updated at each "npm install"
# ./public/OidcTrustedDomains.js <-- won't be updated if already exist 

Avertissement

Si vous utilisez le mode Service Worker , le fichier OidcServiceWorker.js doit toujours être à jour avec la version de la bibliothèque. Vous pouvez configurer un script postinstall dans votre fichier package.json pour le mettre à jour à chaque installation NPM. Par exemple :

  "scripts" : {
    ...
    "postinstall" : " node ./node_modules/@axa-fr/oidc-client/bin/copy-service-worker-files.mjs public "
  },

Plus de documentation:

• @axa-fr/oidc-client

Début avec @ axa-fr / react-oïdc

npm install @axa-fr/react-oidc --save

# To install or update OidcServiceWorker.js file, you can run
node ./node_modules/@axa-fr/react-oidc/bin/copy-service-worker-files.mjs public

# If you have a "public" folder, the 2 files will be created :
# ./public/OidcServiceWorker.js <-- will be updated at each "npm install"
# ./public/OidcTrustedDomains.js <-- won't be updated if already exist 

Avertissement

Si vous utilisez le mode de service de service, le fichier OIDCServiceWorker.js doit toujours être à jour avec la version de la bibliothèque. Vous pouvez configurer un script postinstall dans votre fichier package.json pour le mettre à jour à chaque installation NPM. Par exemple :

  "scripts" : {
    ...
    "postinstall" : " node ./node_modules/@axa-fr/react-oidc/bin/copy-service-worker-files.mjs public "
  },

Plus de documentation:

• @axa-fr/react-oidc

Exécutez les démos

git clone https://github.com/AxaFrance/oidc-client.git

cd oidc-client
pnpm install

# oidc client demo
cd examples/oidc-client-demo
pnpm install
pnpm start
# then navigate to http://localhost:5174

# react vite demo
cd examples/react-oidc-demo
pnpm install
pnpm start
# then navigate to http://localhost:4200

# react NextJS demo
cd examples/nextjs-demo
pnpm install
pnpm run dev
# then navigate to http://localhost:3001 

Comment ça marche

Le service de service attrape Access_token et Refresh_token qui ne seront jamais accessibles au client.

Ces composants résument l'utilisation de " @axa-fr/oidc-client " afin de masquer la complexité du flux de travail. En interne pour " @axa-fr/react-oidc ", l'API d'histoire native est utilisée pour être une bibliothèque de routeurs agnostique.

Plus d'informations sur OIDC:

• Français: Augmentiz la Sécurit et la simplicité de vote système d'openId Connect
• Anglais: augmenter la sécurité et la simplicité de votre système d'information avec OpenID Connect
• Anglais: YouTube React-OiDC Introduction
• Français: YouTube React-OiDC Introduction

FAQ

• FAQ la question demandée fréquentée

Migrations

• Migration de V3 à V4 guide
• Migration de V3 à V5 guide
• Migration de V4 à V5 guide
• Migration de V5 à V6 guide
• Migration du V6 à V7 guide

Contribuer

• Comment exécuter la solution et contribuer
• Veuillez respecter notre code de conduite