4

I'm getting auth-domain-config-required errors when using firebase.auth().signInWithPopup(provider).

I've tried with Google and Facebook. I've tested on my hosted site, and it works fine. You can test it live: Quiver Chat Demo

I suspect there's a problem with localhost:3333... does it not like my port? I can't add a port to the Authorized domains list, and adding it to my authDomain: config doesn't help either.

Here's my auth code, but as you can see from the screenshots below, I tried a bunch of different authDomain values.

  <script src="https://quiver-four.firebaseapp.com/__/firebase/4.6.2/firebase-app.js"></script>
  <script src="https://quiver-four.firebaseapp.com/__/firebase/4.6.2/firebase-auth.js"></script>
  <script>
    // Initialize Firebase
    var config = {
      apiKey: "AIzaSyCzNxnQ6WCJKejq6SBd7NqhVskxEOmDq_Y",
      authDomain: "quiver-four.firebaseapp.com",
      databaseURL: "https://quiver-four.firebaseio.com",
      projectId: "quiver-four",
      storageBucket: "quiver-four.appspot.com",
      messagingSenderId: "1082528354495"
    };
    firebase.initializeApp(config);
  </script>

Attempting localhost:3333

Attempting localhost:3333


Attempting localhost

Just localhost


Attempting quiver-four.firebaseapp.com

quiver-four.firebaseapp.com, as copied from the Firebase console


The domains are added

enter image description here

3
  • 1
    Hey Chris. Can you edit your question to include the code of how you initialize the Firebase app? My first guess is that something's going wrong there. Commented Nov 17, 2017 at 16:11
  • Hey Frank, I tried three varieties and copied them all up. Commented Nov 19, 2017 at 4:38
  • Have you been able so solve this? Facing a similar issue. Commented Apr 19, 2023 at 10:23

2 Answers 2

3

You must not be providing the correct authDomain in your Firebase app initialization configuration. You can get that web snippet from the Firebase Console. The authDomain has the form projectName.firebaseapp.com.

Sign up to request clarification or add additional context in comments.

5 Comments

Sorry. I tried that, and I tried to link to screenshots... but they didn't go up on my first post. I've edited the question to make it explicit.
I checked your site. I am not getting the error you are describing but I am noticing the error in sign in with redirect due to your service worker messing with pages under /__/auth/... which are managed by Firebase Auth team and required to complete sign-in. Please remove that path from your service worker caching.
Yeah. I've seen the same issue with the serviceWorker. That was a quick demo site, so I just deleted the worker for the demo :) The problem is that auth doesn't work on localhost. My point is that it works fine on Firebase hosting but doesn't work on localhost.
The setup should be exactly the same whether localhost or production site. I can't debug your issue if you can't get your sample app working.
OP is correct in setting authDomain to their custom URL according to the docs (related to sign-in with popup and redirects). If your web-application is not hosted under name.firebase.com you'll have to do some of the steps described in the article. However, as OP mentions, firebase does not like us specifying ports for whatever reason..
2

I had the same problem and my solution was to have a file in the root firebase.js with all the connection configuration:

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import {getAuth} from 'firebase/auth'

import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "xxxxxxx_xxx_R-xxx-CDxxxxcg",
  authDomain: "qxxxxxx-xxxx.firebaseapp.com",
  projectId: "xxxxxx-xxxxx",
  storageBucket: "xxxxxxx-xxxx.appspot.com",
  messagingSenderId: "xxxxxxx",
  appId: "1:xxxxxxx:wxb:xxxxxxxxxxxxxx",
  measurementId: "G-xxxxx"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);

export const db = getFirestore(app);
export const auth = getAuth(app);

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.