Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Error: Uncaught (in promise) Error: AuthUI instance is deleted!

Aperta
  • Qualcosa non va?
#59 29 commenti 14 reazioni 1 assegnatario Vedi su GitHub

@jhuleatt ci sta già lavorando.

Dal 26/4/2021.

Valutazione

Questa issue non è ancora stata valutata.

Descrizione

I'm using React-Router, with code like this:

// Import FirebaseAuth and firebase.
import React from "react";
import StyledFirebaseAuth from "react-firebaseui/StyledFirebaseAuth";
import firebase from "firebase";

// Configure Firebase.
const config = {
  apiKey: process.env.REACT_APP_API_KEY,
  authDomain: process.env.REACT_APP_AUTH_DOMAIN,
  databaseURL: process.env.REACT_APP_DATABASE_URL,
  projectId: process.env.REACT_APP_PROJECT_ID,
  storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID
};

firebase.initializeApp(config);

// Configure FirebaseUI.
const uiConfig = {
  // Popup signin flow rather than redirect flow.
  signInFlow: "popup",
  // Redirect to /signedIn after sign in is successful. Alternatively you can provide a callbacks.signInSuccess function.
  signInSuccessUrl: "/signedIn",
  signInOptions: [firebase.auth.GoogleAuthProvider.PROVIDER_ID]
};

export default class SignInScreen extends React.Component {
  render() {
    return (
      <div>
        <h1>My App</h1>
        <p>Please sign-in:</p>
        <StyledFirebaseAuth
          uiConfig={uiConfig}
          firebaseAuth={firebase.auth()}
        />
      </div>
    );
  }
}

And here's my App.js

import React, { PureComponent } from "react";
import { withRouter } from "react-router";
import { Route, Switch } from "react-router-dom";
import NavigationDrawer from "react-md/lib/NavigationDrawers/NavigationDrawer";
// import { ListItem } from "react-md";
import { toTitle } from "./utils";

import { navItems, NavItemLinks } from "./pages/NavItems";
import Home from "./pages/home";
import Citations from "./pages/citations";
import Connect from "./pages/connect";

const styles = {
  content: { minHeight: "auto" }
};

class RoutingExample extends PureComponent {
  constructor(props) {
    super();

    this.state = { toolbarTitle: this.getCurrentTitle(props) };
  }

  componentWillReceiveProps(nextProps) {
    this.setState({ toolbarTitle: this.getCurrentTitle(nextProps) });
  }

  getCurrentTitle = ({ location: { pathname } }) => {
    const lastSection = pathname.substring(pathname.lastIndexOf("/") + 1);
    if (lastSection === "") {
      return "Home";
    }

    return toTitle(lastSection);
  };

  render() {
    const { location } = this.props;
    return (
      <NavigationDrawer
        toolbarTitle="My App"
        mobileDrawerType={NavigationDrawer.DrawerTypes.MINI}
        tabletDrawerType={NavigationDrawer.DrawerTypes.CLIPPED}
        desktopDrawerType={NavigationDrawer.DrawerTypes.CLIPPED}
        navItems={NavItemLinks}
        contentId="main-demo-content"
        // footer={<ListItem primaryText="Drafts" />}
        contentStyle={styles.content}
        drawerTitle={this.state.toolbarTitle}
        contentClassName="md-grid"
      >
        <Switch key={location.pathname}>
          <Route path={navItems[0].to} exact component={Home} />
          <Route path={navItems[1].to} component={Citations} />
          <Route path={navItems[3].to} exact component={Connect} />
        </Switch>
      </NavigationDrawer>
    );
  }
}
export default withRouter(RoutingExample);

I won't explain all of the code, since it's irrelevant. The problem is that the 'Sign In with Google' button only shows up the first time I go to the '/connect' page. If I navigate again and go back, the Auth UI is gone, and when I look in the console I see: "Error: Uncaught (in promise) Error: AuthUI instance is deleted!"

My app also gets slower the more I navigate to and away from the 'connect' page, which makes me think that there might be a memory leak involved.

I have the same problem with the example on the front page using state.

I'd appreciate any help. Thanks!

Lingua principale
JavaScript
Stelle
1.3k
Fork
246
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di firebase/firebaseui-web-react

Tutte le issue di firebase/firebaseui-web-react

Issue simili

Altre issue su JavaScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.