Когда я попытаюсь это сделать, появится всплывающее окно для аутентификации Google с помощью firebase, оно не работает

# #javascript #reactjs #firebase #redux #firebase-authentication

Вопрос:

Когда я пытаюсь выполнить аутентификацию Google с помощью firebase, ни метод googleSignInWithPopup не работает, ни какой-либо другой. Я следую инструкциям в документации, и об этой ошибке ничего не сообщается. Он не выдает никаких ошибок, и все функции вызываются

это код, который я внедряю:

 const firebaseConfig = {
apiKey: "AIzaSyBTtZRgAufHwkuth3Jo-pnTTKl1tBrK92o",
authDomain: "journal-react-redux.firebaseapp.com",
projectId: "journal-react-redux",
storageBucket: "journal-react-redux.appspot.com",
messagingSenderId: "189133948252",
appId: "1:189133948252:web:99aaaedf42fdb97243ed99"
};

firebase.initializeApp(firebaseConfig);


const db = firebase.firestore();
const googleAuthProvider = new firebase.auth.GoogleAuthProvider();


export {
    db,
    googleAuthProvider,
    firebase
}

export const startGoogleLogin = () => {
    return (dispatch) => {
        firebase.auth().signInWithRedirect(googleAuthProvider)
            .then(({ user }) => {
                dispatch(
                    login(user.uid, user.displayName)
                )
            });

    }
}

export const login = (uid, displayName) => {
    return {
        type: types.login,
        payload: {
            uid,
            displayName
        }
    }

}


const handleGoogleLogin = () =>{
    dispatch(startGoogleLogin);
}
 

это весь код, в котором он используется и объявлен для использования.
PS: Это приложение сделано в react 17 с помощью redux.

Ответ №1:

Не могли бы вы попробовать этот фрагмент кода? Кроме того, убедитесь, что аутентификация Google включена в консоли Firebase

 export const loginUserWithGoogle = () => {
    const provider = new firebase.auth.GoogleAuthProvider();

    return auth
        .signInWithPopup(provider)
        .then((result) => {
            return result.user;
        })
}
 

Затем вы можете использовать этот код в своих действиях

 export const logInWithGoogle = () => {
    return (dispatch) => {
        loginUserWithGoogle()
            .then((user) => {
                // ... do something with user
            })
            .catch(error => {
                console.log(error)
            })
    }
}
 

Попробуйте обновить свою функцию до

 const handleGoogleLogin = () => {
    return (dispatch) => { 
        dispatch(startGoogleLogin);
    }
}
 

Комментарии:

1. Да, я включаю аутентификацию Google на консоли firebase, но это ни на что не похоже. Я уже пытался деактивировать его и активировать снова, изменить проект, учетные данные, но он остается прежним. И если бы я попробовал то, что вы мне поставили, но ничего не вышло, ни ошибки, ни работы.

2. Не могли бы вы добавить фрагмент кода с примером того, как вы выполняете код?

3. если вы печатаете что-то перед этой строкой firebase.auth().signInWithRedirect(googleAuthProvider) , передается ли это на консоль принтером?

4. да, это конфигурация в архиве firebase.js: ` const db = firebase.firestore(); const googleAuthProvider = новая firebase.auth. GoogleAuthProvider(); экспорт { бд,googleAuthProvider,firebase}` это auth.js архив: export const startGoogleLogin = () => { return (dispatch) => { firebase.auth().signInWithPopup(googleAuthProvider) .then(({ user }) => { dispatch( login(user.uid, user.displayName) ) }); } } startGoogleLogin вызывается при нажатии кнопки с помощью handleGoogleLogin, как показано выше в вопросе

5. Я не использую cdn, я устанавливаю firebase в проекте. Кнопка запускает функцию handleGoogleLogin при нажатии, но никогда не открывает всплывающее окно входа