'How to enable sign-in with Google on Backstage?

On Backstage, after following all the steps on https://backstage.io/docs/auth/google/provider, I get the message "The Google provider is not configured to support sign-in" after going through the Google SSO interface.

If I understood correctly, I have to setup Backstage to enable/allow Google provider to sign-in users. But I'm lost on how to do this.

How to configure Google provider to support sign-in on Backstage?

enter image description here



Solution 1:[1]

It seems you missed the backend app's auth plugin configuration as mentioned in the docs

You should create a resolver function to map the google's user identity to a backstage's user identity or, optionally, skip the catalog's user lookup ( there are caveats to this approach ).

The following documentation explains about the resolver function and user identities: Sign-in Identities and Resolvers

The following code is an example of how you would achieve a google resolver WITHOUT mapping to a backstage user identity and I recommend using it for testing purposes only and, as previosly mentioned, there are caveats to this approach. I strongly recommend understanding the documentation and the power mapping the external user identity to a backstage user identity unleashes.

./packages/backend/src/plugins/auth.ts

import { createRouter, providers } from '@backstage/plugin-auth-backend';
import { Router } from 'express';
import { PluginEnvironment } from '../types';
import { DEFAULT_NAMESPACE, stringifyEntityRef, } from '@backstage/catalog-model';

export default async function createPlugin(
  env: PluginEnvironment,
): Promise<Router> {
  return await createRouter({
    ...env,
    providerFactories: {
      google: providers.google.create({
        signIn: {
          resolver: async ({ profile }, ctx) => {
            if (!profile.email) {
              throw new Error(
                'Login failed, user profile does not contain an email',
              );
            }
            const [localPart] = profile.email.split('@');
            const userEntityRef = stringifyEntityRef({
              kind: 'User',
              name: localPart,
              namespace: DEFAULT_NAMESPACE,
            });
          
            return ctx.issueToken({
              claims: {
                sub: userEntityRef,
                ent: [userEntityRef],
              },
            });
          },
        },
      }),
    },
  });
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1