API Key not found error

Hello,

I am following the README instructions very closely but cannot get email/password authentication to work for the life of me:

import React, { Component } from "react";

import StyledFirebaseAuth from "react-firebaseui/StyledFirebaseAuth";
import firebase from "firebase";

const config = {
  // Copied directly from the Firebase console...
};
firebase.initializeApp(config);

const firebaseUIConfig = {
  signInOptions: [
    {
      provider: firebase.auth.EmailAuthProvider.PROVIDER_ID,
      requireDisplayName: false,
      signInMethod: firebase.auth.EmailAuthProvider.EMAIL_PASSWORD_SIGN_IN_METHOD
    }
  ],
  tosUrl: "https://irace.me",
  privacyPolicyUrl: "https://irace.me"
};

class App extends Component {
  render() {
    return <StyledFirebaseAuth uiConfig={firebaseUIConfig} firebaseAuth={firebase.auth()} />;
  }
}

When choosing my email address from the dropdown, I get the following error:

[  5.887s] [firebaseui] Internal error: {"error":{"code":400,"message":"API Key not found. Please pass a valid API key.","errors":[{"message":"API Key not found. Please pass a valid API key.","domain":"global","reason":"badRequest"}],"status":"INVALID_ARGUMENT"}}

When looking at the HTTP traffic, I see that the API key is in fact present:

Any ideas? Totally stuck on this – thanks in advance!

[jeroenpelgrims]

In my case the issue was that I had previously created a project with the same name. Take a look here: https://console.developers.google.com/cloud-resource-manager I had 2 projects there that somehow conflicted with each other.

For me, since this was a new project, the easiest solution was to delete the entire project (in firebase AND in the cloud resource manager) and then create it from scratch.

[mephix]

hi guys, I figured it out without having to delete my project. The solution was “REGENERATE KEY” in the top right of the screenshot below. Note that I also renamed my project as per @resurge , so the solution may be these two things in combination.