Setting Authentication flow for identity providers (SSO)

Hey community, hope you all are fine.

I want to ask for your help since we don’t know which way to go with the keycloak. We have tried to configure the authentication flows in different ways with no success.We do not know if it is a problem in them or if we have to do an additional configuration so that the SSO works for registration and for login.

At this moment we are trying to use the ‘First broker login’ as a base and it is allowing us to create the account with the user info we need but when we go to our application the following error message appears on the console.

*Access to XMLHttpRequest at 'https://login-staging.struxtion.com/auth/realms/struxtion/protocol/openid-connect/token' from origin 'https://portal-staging.struxtion.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.*


FULL IMAGE

In our code we are executing this where the authentication is failing (lines 84 and 191)

76

export const loginToKeycloak = ({
  setKeycloak,
  setUser,
  setAuthError,
  trackAnalytics,
}) => {
  const keycloakClient = getKeycloakClient();

  keycloakClient.init({ onLoad: 'login-required' })
    .then((isAuthenticated) => {
      if (isAuthenticated) {
        setAxiosInterceptor(keycloakClient);

        const {
          tokenParsed: {
            struxtion: { userId, company, roles },
          },
        } = keycloakClient;

        axios.get(`/api/user/${userId}`)
          .then(({ data }) => {
            setUser({
              ...data,
              roles,
              companyId: company?.id,
              companyName: company?.name,
              companyType: companyTypes[company?.type?.toUpperCase()],
            });

            if (trackAnalytics) {
              setGtagUser(userId);
              setGtagCompany(company?.id, company?.name);
            }

            setKeycloak({
              authenticated: true,
              logout: () => keycloakClient.logout({ redirectUri: window.origin }),
              refresh: () => keycloakClient.updateToken(99999999),
            });
          })
          .catch(() => { setAuthError(true); });
      } else {
        setAuthError(true);
      }
    })
    .catch(() => { setAuthError(true); });
};

189

React.useEffect(() => {
    if (!authenticated) {
      loginToKeycloak({
        setKeycloak,
        setUser,
        setAuthError,
        trackAnalytics,
      });
    }
  }, [setKeycloak, setUser, authenticated, trackAnalytics]);

This is happening only when we are trying to create a NEW account with an identity provider, but when we already had set up a manually created account the redirection is working the way it is expected to. If we try to log in with an external provider and the account is already created completely the link with the provider is done, but when we try to create it from the provider the link is not happening. We also want to know if it’s possible to override the linking verification through email and just have a notification.

So this is the problem in which we are stuck, I hope someone knows how we could solve it and if they have the disposition and the time to help us it would be very good! I thank you for your attention!