未捕获(承诺):FirebaseError

Lui*_*era 6 javascript firebase angularfire firebase-authentication angular

我收到以下错误。我的问题在于实际的错误,而在于它说错误是Uncaught。如果您查看我的auth.service.ts文件sign-in.component.ts,我会发现错误。

我的问题是,为什么在控制台中出现错误:未捕获(承诺)错误?我缺少什么?

我在用着
"@angular/fire": "^7.0.4"
"firebase": "^9.0.2"
"rxjs": "6.6.7"

在此输入图像描述

auth.service.ts

    /**
     * Sign in
     *
     * @param credentials
     */
    signIn(credentials: { email: string; password: string }): Promise<any> 
    {
        return this.auth.signInWithEmailAndPassword(credentials.email, credentials.password)
            .then((userCredential) => {
                
                // Signed in 
                const user = userCredential.user;
                //console.log(user);

                // Store the access token in the local storage
                userCredential.user.getIdToken().then(token => {
                    this.accessToken = token;
                    //console.log(token);
                })

                // Set the authenticated flag to true
                this._authenticated = true;

                // Store the user on the user service
                //this._userService.user = user;

                // ...
            })
            .catch((error) => {
                const errorCode = error.code;
                const errorMessage = error.message;
                console.log('Show Error', error.code);
                throw errorCode;
            });
    }
Run Code Online (Sandbox Code Playgroud)

登录.component.ts

    /**
     * Sign in
     */
    signIn(): void
    {
        // Return if the form is invalid
        if ( this.signInForm.invalid )
        {
            return;
        }

        // Disable the form
        this.signInForm.disable();

        // Hide the alert
        this.showAlert = false;

        // Sign in
        this._authService.signIn(this.signInForm.value)
            .then(
                () => {

                    // Set the redirect url.
                    // The '/signed-in-redirect' is a dummy url to catch the request and redirect the user
                    // to the correct page after a successful sign in. This way, that url can be set via
                    // routing file and we don't have to touch here.
                    const redirectURL = this._activatedRoute.snapshot.queryParamMap.get('redirectURL') || '/signed-in-redirect';

                    // Navigate to the redirect url
                    this._router.navigateByUrl(redirectURL);

                },
                (response) => {

                    console.log('error from auth.service', response);

                    // Re-enable the form
                    this.signInForm.enable();

                    // Reset the form
                    this.signInNgForm.resetForm();

                    // Set the alert
                    this.alert = {
                        type   : 'error',
                        message: 'Wrong email or password'
                    };

                    // Show the alert
                    this.showAlert = true;
                }
            );
    }
Run Code Online (Sandbox Code Playgroud)

rau*_*bad 5

首先,我的母语不是英语,所以如果我写得像个傻瓜,你就知道为什么。

尝试这个:

_authService.service.ts

    import { getAuth, signInWithEmailAndPassword, Auth, inMemoryPersistence, browserLocalPersistence } from '@angular/fire/auth';


    constructor(private _fireAuth: Auth,) {

/**
 * Sign-in
 *
 * @param credentials
 * @param rememberMe
 */
    async signIn(credentials: { email: string; password: string }, rememberMe: boolean): Promise<any> {
        // firebase Persistence.LOCAL   browserLocalPersistence
        // firebase Persistence.SESSION browserSessionPersistence
        // firebase Persistence.NONE    inMemoryPersistence

        return new Promise(async (resolve, reject) => {
            //Initialize auth()
            const auth = getAuth();

            // Extra function
            if (rememberMe) {
                await getAuth().setPersistence(browserLocalPersistence).catch(error => reject(-1));
            } else {
                await getAuth().setPersistence(inMemoryPersistence).catch(error => reject(-1));
            }

            signInWithEmailAndPassword(auth, credentials.email, credentials.password).then(async (userCredential) => {
                // Signed in 
                const user = userCredential.user;
                console.log(user);

                // Store the access token in the local storage
                await userCredential.user.getIdTokenResult().then(token => {
                    this.accessToken = token.token;
                    console.log(token);
                })

                // Set the authenticated flag to true
                this._authenticated = true;
            }).catch(error => reject(error.code));
        });
    }
Run Code Online (Sandbox Code Playgroud)

笔记:正如您所看到的,我添加了一些额外的功能,如果您不感兴趣,您可以删除这些功能(setPersistence),这使您可以考虑用户选择保持登录状态(如果他愿意),或者在需要时删除他的登录信息他关闭了选项卡。

登录.component.ts

alert = {
        userNotFound : false,
        wrongPassword: false,
        unknownError : false,
};
    /**
     * Sign in
     */
    signIn(): void
    {
        // Return if the form is invalid
        if ( this.signInForm.invalid )
        {
            return;
    }

    // Disable the form
    this.signInForm.disable();

    // Hide the alert
    this.showAlert = false;

    // Sign in
    this._authService.signIn(this.signInForm.value)
        .then(
            () => {

                // Set the redirect url.
                // The '/signed-in-redirect' is a dummy url to catch the request and redirect the user
                // to the correct page after a successful sign in. This way, that url can be set via
                // routing file and we don't have to touch here.
                const redirectURL = this._activatedRoute.snapshot.queryParamMap.get('redirectURL') || '/signed-in-redirect';

                // Navigate to the redirect url
                this._router.navigateByUrl(redirectURL);

            },
            (response) => {

                console.log('error from auth.service', response);

                // Re-enable the form
                this.signInForm.enable();

                // Reset the form
                this.signInNgForm.resetForm();

                // Set the alert
                if (error === - 1) {
                this.alert.unknownError = true;
                } else if (error === 'auth/email-not-found' || error === 'auth/user-not-found') {
                this.alert.userNotFound = true;
                } else if (error === 'auth/wrong-password') {
                this.alert.wrongPassword = true;
                }
            }
        );
}
Run Code Online (Sandbox Code Playgroud)

  • 您的代码示例中有几个错误,但是在我修复了这些错误之后,它就像一个魅力。谢谢你,先生!!! (2认同)