Better AuthBA
Better Auth•5mo ago
The Untraceable

Issues signing in with SSO

Hello. I register my SSO Provider using the OIDC config in the authClient.sso.register function, and I get the data stored in the database in the format of 
{
  "_id": {
    "$oid": "688132034fd131f8a55b9c4a"
  },
  "issuer": "https://integrator-3792584.okta.com",
  "oidcConfig": "{\"issuer\":\"https://integrator-123123.okta.com\",\"clientId\":\"realClientId\",\"clientSecret\":\"realClient-secret-frfr\",\"discoveryEndpoint\":\"https://integrator-123123.okta.com/.well-known/openid-configuration\",\"overrideUserInfo\":false}",
  "samlConfig": null,
  "userId": {
    "$oid": "687c0aa90f36bfb25e8a2594"
  },
  "providerId": "sso-asdasda",
  "organizationId": "687c1effbc69ee4a72c21876",
  "domain": "untraceable.dev"
}

The providerId is just sso-${organization.slug}.

When I try to log in with email being set with that domain, I get a 500 and this in the logs: # SERVER_ERROR: [TypeError: Invalid URL] { code: 'ERR_INVALID_URL', input: 'undefined' }

I have set my logger to: 
    logger: {
        level: "info",
        disabled: false,
        log: (level, message, ...args) => {
            console.log(`[${level}] ${message}`, ...args);
        }
    }

but I see nothing in the terminal.
'use client';

import { authClient } from '@/lib/auth-client';
import { showErrorToast } from '@/lib/utils/toast';
import { Button } from '@heroui/button';
import { Input } from '@heroui/input';
import { useRouter } from 'next/navigation';
import { useState } from 'react';

export default function LoginWithSSO() {
    const router = useRouter();
    const [email, setEmail] = useState('');

    return (
        <div className="flex flex-col items-center justify-center">
            <Input
                onValueChange={setEmail}
                placeholder="Enter your email"
                value={email}
            />
            <Button onPress={async () => {
                const response = await authClient.signIn.sso({
                    email,
                    callbackURL: "https://dev.untraceable.dev/account/settings"
                })
                if (response.error) {
                    showErrorToast("Failed to initiate SSO login", "Failed to login with SSO. Please try again.");
                }
            }}>
                Login with SSO
            </Button>
        </div>
    );
}

That's my code for signing in with SSO for now.

Here is how I register my SSO Provider. 
            if (!domain) {
                showErrorToast(
                    'The company domain must be set to configure SSO.',
                    'Please enter your company domain.'
                );
                return;
            }
            await authClient.sso.register({
                providerId,
                domain,
                oidcConfig: {
                    ...data,
                    discoveryEndpoint: `${data.issuer}/.well-known/openid-configuration`,
                },
                issuer: data.issuer,
                organizationId: organization.id,
                fetchOptions: {
                    onSuccess: () => {
                        showSuccessToast(
                            'SSO Configuration Saved',
                            'Your SSO settings have been successfully saved.'
                        );
                        ssoForm.reset();
                        setDomain(''); // Reset form to initial state on success
                    },
                    onError: (context) => {
                        showErrorToast(context.error.message, '');
                    },
                },
            });


I am using Okta for testing.
Was this page helpful?