Svelte OIDC Component https://darrelopry.com/svelte-oidc/
Find a file
Darrel O'Pry 6859dfb31b fix: silentlogin and checksession
I was forcing a redirect login result. Switch to signinCallback instead
of signinRedirectCallback. signinCallbacks checks the login type
varaible and calls the appropriate redirect, popup, or silent callback
as necessary.
2020-06-04 03:21:05 -04:00
cypress feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
public feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
src fix: silentlogin and checksession 2020-06-04 03:21:05 -04:00
.eslintrc.js feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
.gitignore feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
.npmrc feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
.prettierrc feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
cypress.json feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
package-lock.json feat: highlight json 2020-05-28 12:40:40 -04:00
package.json fix: route /callback to spa demo 2020-06-04 03:14:17 -04:00
README.md docs: correct README.md 2020-05-28 12:53:42 -04:00
rollup.config.js feat: oidc-client.js based Svelte OidcComponent 2020-05-28 11:34:47 -04:00
rollup.config.showcase.js chore: setup distinct app for svelte-oidc-demo 2020-05-28 13:00:21 -04:00

svelte-oidc

An Oidc Client Component for Svelte.

Try out the demo

Getting Started

Setup an OIDC Sever

Get the authority and client_id

npm install @dopry/svelte-oidc

App.svelte

# App.svelte
import {
  OidcContext,
  authError,
  authToken,
  idToken,
  isAuthenticated,
  isLoading,
  login,
  logout,
  userInfo,
} from '@dopry/svelte-oidc';
</script>

<OidcContext
 issuer="https://dev-hvw40i79.auth0.com"
 client_id="aOijZt2ug6Ovgzp0HXdF23B6zxwA6PaP"
 redirect_uri="https://darrelopry.com/svelte-oidc/"
 post_logout_redirect_uri="https://darrelopry.com/svelte-oidc/">

  <button on:click|preventDefault='{() => login() }'>Login</button>
  <button on:click|preventDefault='{() => logout() }'>Logout</button><br />
  <pre>isLoading: {$isLoading}</pre>
  <pre>isAuthenticated: {$isAuthenticated}</pre>
  <pre>authToken: {$authToken}</pre>
  <pre>idToken: {$authToken}</pre>
  <pre>userInfo: {JSON.stringify($userInfo, null, 2)}</pre>
  <pre>authError: {$authError}</pre>
</OidcContext>

Docs

Components

  • OidcContext - component to initiate the OIDC client. You only need one instance in your DOM tree at the root.

    Attributes:

    • issuer - OIDC Authority/issuer/base url for .well-known/openid-configuration
    • client_id - OAuth ClientId
    • redirect_uri - default: window.location.href
    • post_logout_redirect_uri - override the default url that OIDC will redirect to after logout. default: window.location.href

Functions

  • login(preseveRoute = true, callback_url = null) - begin a user login.
  • logout(logout_url = null) - logout a user.
  • refreshToken - function to refresh a token.

Stores

  • isLoading - if true OIDC Context is still loading.
  • isAuthenticated - true if user is currently authenticated
  • authToken - api token
  • userInfo - the currently logged in user's info from OIDC
  • authError - the last authentication error.

Constants

  • OIDC_CONTEXT_CALLBACK_URL,
  • OIDC_CONTEXT_CLIENT_PROMISE - key for the OIDC client in setContext/getContext.
  • OIDC_CONTEXT_LOGOUT_URL,

Release

use semver npm publish npm showcase:build npm showcase:publish