Всплывающее окно входа в Firebase автоматически закрывается на Heroku

Мы используем логин FireBase для нашего приложения в React, и кажется, что поток работает нормально на локальном хосте.

Но когда мы развертываем наше приложение на Heroku, на экране появляется окно входа в систему с помощью Google, которое почти мгновенно закрывается.

Вот мой auth.js

export function loginWithGoogle (email, pw) {
  const provider = googleAuthProvider;
  return firebaseAuth().signInWithPopup(provider)
  .then(saveUser)
  .catch(error => console.log(error));
}

Вот логин.js

handleGoogleLogin = e => {
    e.preventDefault();
    loginWithGoogle()
      .then(response => {
        // This gives you a Google Access Token. You can use it to access the Google API.
        console.log("After auth...",response);
        //const TOKEN = response.credential.accessToken;
        console.log("result...", response);

        //TODO: Need to call ConsumeSafe API to store the user details
        console.log("invoking getUser");
        getUser(response.data.user.Email).
        then((res) =>{
          this.props.loginHandler(res);
        });

      })
      .catch(error => {
        console.log("Error in popup...",error);
        this.setState(setErrorMsg("Invalid username/password."));
      });
  };

Однако ни один из файлов не обнаруживает ошибок, но окно закрывается.

На моей консоли разработчика Google я перешел в «Учетные данные»> «Веб-клиент Oauth2» и добавил URL-адрес моего приложения heroku в авторизованные источники javascript. Все тот же результат