[Solved] Idpiframe initialization failed error when using Google sing-in

I monkeyed around enough to get the button asking me to login. However, when I finish the authentication journey, Metabase doesn’t react, and I get this in the console:

There was an error logging in {error: "popup_closed_by_user"}

However, I also get this at page load, which seems suspiciously related:

{
  error: "idpiframe_initialization_failed",
  details: "Not a valid origin for the client: https://my-cool-metabase.herokuapp.com has not been whitelisted for client ID number-number.apps.googleusercontent.com. Please go to https://console.developers.google.com/ and whitelist this origin for your project's client ID."
}

I’ve already registered the mentioned url as valid origin (both for the callback and the JS origin).

I’m unsure how to keep debugging this. Can someone spare some pointers?

Hi @pkoch-frctls
Which version of Metabase?
It seems like something is not fully correct with the configuration in the Google Console, so you might want to delete it and create a new (and add that new ClientID to Metabase).
Until Google doesn’t complain, then there’s not much to debug on the Metabase side, so the error comes from Google.
But there’s no “callback” for this type of credentials, so maybe you created the wrong type? It should be “Web application” type.
There’s only “Authorized JavaScript origins” under Credentials and then you should add your TLD domain under “OAuth consent screen”.

Which version of Metabase?

I’m using v0.33.0-preview2 on Heroku.

Until Google doesn’t complain, then there’s not much to debug on the Metabase side, so the error comes from Google.

I figured out my problem. When faced with this screen:
Screenshot%20from%202019-07-07%2014-12-04
I had chosen Web server before. When I deleted my stuff on Google and restarted the process with Web browser, the errors went away and things started working!

Perhaps this is something that we can make clearer in the instructions?

@pkoch-frctls
Great you got it working. Don’t you think it’s described well enough via the link?

When you configure the project, select the Web browser client type and specify the origin URI of your app.

Where is that verbiage? This is what I see in the configuration page on Metabase:

Allows users with existing Metabase accounts to login with a Google account that matches their email address in addition to their Metabase username and password.

To allow users to sign in with Google you’ll need to give Metabase a Google Developers console application client ID. It only takes a few steps and instructions on how to create a key can be found here.

I don’t recall seeing what you mentioned anywhere. :no_mouth:

@pkoch-frctls
When you click the instruction link, then you’re taken to the Google guide page, which gives you that information just below the big blue action button.
I think the text included in Metabase is purposely a little vague, so when Google changes something, then the text doesn’t need to be updated constantly.

1 Like

Oh, I see! I don’t have a good suggestion, then.

Thank you for your help!