added option to retrieve the OIDC user info from the id_token payload

This commit is contained in:
Gani Georgiev
2024-10-12 10:16:01 +03:00
parent 95d5ee40b0
commit 3c87df9e55
40 changed files with 465 additions and 218 deletions
@@ -1,11 +1,21 @@
<script>
import { slide } from "svelte/transition";
import tooltip from "@/actions/tooltip";
import Field from "@/components/base/Field.svelte";
import ObjectSelect from "@/components/base/ObjectSelect.svelte";
import MultipleValueInput from "@/components/base/MultipleValueInput.svelte";
import CommonHelper from "@/utils/CommonHelper";
export let key = "";
export let config = {};
const userInfoOptions = [
{ label: "User info URL", value: true },
{ label: "ID Token", value: false },
];
let hasUserInfoURL = !!config.userInfoURL;
if (CommonHelper.isEmpty(config.pkce)) {
config.pkce = true;
}
@@ -13,6 +23,23 @@
if (!config.displayName) {
config.displayName = "OIDC";
}
if (!config.extra) {
config.extra = {};
}
$: if (typeof hasUserInfoURL !== undefined) {
refreshUserInfoState();
}
function refreshUserInfoState() {
if (!hasUserInfoURL) {
config.userInfoURL = "";
config.extra = config.extra || {};
} else {
config.extra = {};
}
}
</script>
<Field class="form-field required" name="{key}.displayName" let:uniqueId>
@@ -32,11 +59,57 @@
<input type="url" id={uniqueId} bind:value={config.tokenURL} required />
</Field>
<Field class="form-field required" name="{key}.userInfoURL" let:uniqueId>
<label for={uniqueId}>User info URL</label>
<input type="url" id={uniqueId} bind:value={config.userInfoURL} required />
<Field class="form-field m-b-xs" let:uniqueId>
<label for={uniqueId}>Fetch user info from</label>
<ObjectSelect id={uniqueId} items={userInfoOptions} bind:keyOfSelected={hasUserInfoURL} />
</Field>
<div class="sub-panel m-b-base">
{#if hasUserInfoURL}
<div class="content" transition:slide={{ delay: 10, duration: 150 }}>
<Field class="form-field required" name="{key}.userInfoURL" let:uniqueId>
<label for={uniqueId}>User info URL</label>
<input type="url" id={uniqueId} bind:value={config.userInfoURL} required />
</Field>
</div>
{:else}
<div class="content" transition:slide={{ delay: 10, duration: 150 }}>
<p class="txt-hint txt-sm m-b-xs">
<em>
Both fields are considered optional because the parsed <code>id_token</code>
is a direct result of the trusted server code->token exchange response.
</em>
</p>
<Field class="form-field m-b-xs" name="{key}.extra.jwksURL" let:uniqueId>
<label for={uniqueId}>
<span class="txt">JWKS verification URL</span>
<i
class="ri-information-line link-hint"
use:tooltip={{
text: "URL to the public token verification keys.",
position: "top",
}}
/>
</label>
<input type="url" id={uniqueId} bind:value={config.extra.jwksURL} />
</Field>
<Field class="form-field" name="{key}.extra.issuers" let:uniqueId>
<label for={uniqueId}>
<span class="txt">Issuers</span>
<i
class="ri-information-line link-hint"
use:tooltip={{
text: "Comma separated list of accepted values for the iss token claim validation.",
position: "top",
}}
/>
</label>
<MultipleValueInput id={uniqueId} bind:value={config.extra.issuers} />
</Field>
</div>
{/if}
</div>
<Field class="form-field" name="{key}.pkce" let:uniqueId>
<input type="checkbox" id={uniqueId} bind:checked={config.pkce} />
<label for={uniqueId}>