add-pcke

Author: ruvenzx

src/components/TestIframe.js

@@ -80,13 +80,16 @@ function SilentCallback() {
 }
 
 function generateCodeVerifier() {
-  let result = '';
-  const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-._~';
-  const charactersLength = characters.length;
-  for (let i = 0; i < 128; i++) {
-    result += characters.charAt(Math.floor(Math.random() * charactersLength));
-  }
-  return result;
+  const array = new Uint8Array(96);
+  crypto.getRandomValues(array);
+  return btoa(String.fromCharCode(...array))
+    .replace(/=/g, '').replace(/\+/g, '-').replace(/\//g, '_');
+}
+
+async function generateCodeChallenge(verifier) {
+  const digest = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(verifier));
+  return btoa(String.fromCharCode(...new Uint8Array(digest)))
+    .replace(/=/g, '').replace(/\+/g, '-').replace(/\//g, '_');
 }
 
 
@@ -111,11 +114,15 @@ function TestIframe() {
       const iframe = document.getElementById('silent-auth-iframe');
       if (iframe && iframe.parentNode) document.body.removeChild(iframe);
       sessionStorage.removeItem('silent-auth-state');
+      sessionStorage.removeItem('silent-auth-verifier');
     };
 
     const checkSilentAuth = async () => {
+      const codeVerifier = generateCodeVerifier();
+      const codeChallenge = await generateCodeChallenge(codeVerifier);
       const state = generateCodeVerifier();
       sessionStorage.setItem('silent-auth-state', state);
+      sessionStorage.setItem('silent-auth-verifier', codeVerifier);
 
       const done = (status, authenticated = false) => {
         cleanup();
@@ -137,10 +144,26 @@ function TestIframe() {
 
         if (event.data.code) {
           try {
-            await sdk.oauth.exchange(event.data.code);
-            done('Authenticated via custom domain', true);
+            const verifier = sessionStorage.getItem('silent-auth-verifier');
+            sessionStorage.removeItem('silent-auth-verifier');
+            const projectId = 'Puse136yK1TiyR4tmmaVToRDQs9icEIl';
+            const customDomain = 'https://auth.reuven.descope.org';
+            const redirectUri = `${window.location.origin}/silent-callback`;
+            const res = await fetch(`${customDomain}/v1/auth/oauth/exchange`, {
+              method: 'POST',
+              headers: { 'Content-Type': 'application/json' },
+              body: JSON.stringify({ code: event.data.code, codeVerifier: verifier, clientId: projectId, redirectUri }),
+              credentials: 'include',
+            });
+            if (res.ok) {
+              done('Authenticated via custom domain', true);
+            } else {
+              const body = await res.text();
+              console.log('Silent auth: exchange failed', res.status, body);
+              done('No existing session');
+            }
           } catch (err) {
-            console.log('Silent auth: exchange failed', err);
+            console.log('Silent auth: exchange error', err);
             done('No existing session');
           }
         } else {
@@ -165,6 +188,8 @@ function TestIframe() {
         `&redirect_uri=${encodeURIComponent(redirectUri)}` +
         `&oidc_error_redirect_uri=${encodeURIComponent(redirectUri)}` +
         `&state=${state}` +
+        `&code_challenge=${codeChallenge}` +
+        `&code_challenge_method=S256` +
         `&prompt=none` +
         `&scope=openid profile email`;