Sign in with Google

General
1

I can not get Sign in with Google to work in my app.

To make sure something in my app is not interfering with that part, I have made a new project, just to see if Studio can actually make Sign in with Google work (and use Firebase Authentication). Note, I have made that working in over 10 previous projects. So I know it is possible and used to work quite well during the last 2 months.

Now my new super simple project has just a home page, login page and a page you land when you are logged in. I have enabled billing, added all the project URLs to GCP Console, Firebase, etc. I simply can not get Sign in with Google to work on the last 2 projects. Did something change or am I still missing something (getting old)?

Just a note: The Sign in with Google actaully works when you are in Prototyper. But on a preview URL or site published to Hosting, I get this error (as per image).

image
image1407×1305 108 KB

2

This has more to do with your browser settings and certain browsers blocking pop ups. The sign in with redirect method is more reliable, although that still fails a lot lol. Good luck.

3

Try switching to “vibe coder” mode (a.k.a. prototyper) to sign in.

Also, be sure you have the domain accessible from within Firebase Console.

4

If this has not been fixed let me know and I will get you going again

5

The fact that it works in the Prototyper but fails on the Preview/Hosting URL is the master clue. :man_detective:

It strongly suggests that:

  • Your code is correct.

  • Your Firebase project is set up correctly.

  • The issue is very likely a domain authorization mismatch.

The error you’re seeing (which is often auth/popup-closed-by-user) can be misleading. It’s often a generic error that means the Google Sign-In popup flow failed because a URL in the chain wasn’t on the allowlist.

Here’s the solution. It’s key to have your URLs added to two separate consoles. It’s very common to miss the second one, even for experienced folks.

The Two-Location Authorization Fix

Let’s double-check both spots, as sometimes new projects don’t get fully provisioned automatically.

Step 1: Get Your URLs

You will need all the URLs where your app will live:

  1. Preview URL: https://[your-workspace-id].cloudworkstation.dev

  2. Hosting URL: https://[your-project-id].web.app (if using classic Firebase Hosting)

  3. App Hosting URL: https://[your-app-name].apphosting.dev (if you are using the newer Firebase App Hosting)

Step 2: Check Firebase Console (The Obvious One)

This is the first spot, and it’s likely one you’ve already configured.

  1. Go to Firebase Console > Authentication > Settings > Authorized Domains.

  2. Ensure all your domains (e.g., my-project.web.app, my-project.apphosting.dev, and your cloudworkstation.dev URL) are listed here.

Step 3: Check Google Cloud Console (The Easy-to-Miss One)

This is a very common spot for a mismatch. The OAuth 2.0 Client ID that Firebase creates needs to be manually updated with all your URLs.

  1. Go to the Google Cloud Console: https://console.cloud.google.com/

  2. Make sure you have the correct project selected in the top dropdown.

  3. Go to APIs & Services > Credentials.

  4. Under “OAuth 2.0 Client IDs,” find the one named “Web client (auto created by Google Service)” (or the one you are using for your web app). Click the pencil icon :pencil: to edit it.

  5. Now, update both lists:

    • Authorized JavaScript origins: Click + ADD URI and add your Preview and Hosting URLs (e.g., https://my-project.web.app and https://my-workspace.cloudworkstation.dev).

    • Authorized redirect URIs: This is another critical field to check. Click + ADD URI and add your project’s special auth handler URL. You can find this in your Firebase Console (under Authorized Domains) or build it.

      • It looks like this: https://[YOUR-PROJECT-ID].firebaseapp.com/__/auth/handler

  6. Click Save.

:hourglass_not_done: Wait 5 Minutes and Test

It can take 2-5 minutes for these changes to take effect across Google’s systems. After waiting, do a hard refresh on your published site (Ctrl+Shift+R or Cmd+Shift+R) and try signing in again.

This process often resolves the issue. It’s a very picky configuration, and you were on the right track; the setting is just buried in a different console. :+1: