Hello,
I’m trying to add a social login button to the app of my company using a self hosted login (not a widget), I’ve read the Okta documentation but I can’t find how to use the button to redirect to the external provider.
I’m usign okta-auth-js.
Can someone help me with an example of a social button please ?
One of the options you have for that is to pass in an idp option, which is the ID for the external Identity Provider created for the IdP in Okta, when the authorize request is made, so that the user gets redirected to their external, social IdP and, then once they are logged in there and JIT’d into Okta, they will be sent back to your application via the redirect_uri.
So an idea for your use case, you can have these social login buttons determine which ID to add as the idp parameter for this call and trigger the redirect to the authorize endpoint.
Sounds like there’s something malformed in your authorize request. Are you getting a specific error back, or just a generic 400?
Usually when you see a generic 400 Bad Request when you make an authorize redirect to Okta (so there was no redirect to your IdP), there’s something wrong with the Client ID you are passing in. Make sure you are copying the Client ID from the OIDC application you created exactly how it appears AND ensure that the OIDC application itself is set to ACTIVE
Another thing: if you remove the “idp” parameter from your request, do you still see the same error?
Next step would be to add logic on your callback route that looks something like the following (copied from our AuthJS docs):
if (authClient.isLoginRedirect()) {
// callback flow
await authClient.handleLoginRedirect();
} else {
// normal app flow
}
This will let your app take the token returned in the hash fragment and store it in the TokenManager, so that you can use methods like isAuthenticated to determine if the user is already logged in with valid/active tokens.
In my case, I’m usign the default React component LoginCallback (which is imported from ‘@okta/okta-react’).
Does it support social connect authentication callback?
How are you making the authorize request with the idp param? Are you manually redirecting, or are you using one of our SDK methods to do the make the call for you (aka, does your OktaAuth config contain ‘idp’)?
I tried the signInWithRedirect function with the idp as parameter and it work now!
Below the code I used: oktaAuth.signInWithRedirect({ idp: '0oa1iscGDFQFq7jYRF0l7' });