Google Auth mit React Native Expo-FehlerAndroid

Forum für diejenigen, die für Android programmieren
Guest
 Google Auth mit React Native Expo-Fehler

Post by Guest »

Ich experimentiere mit Problemen, wenn ich meine App erstelle (die sich noch in der Entwicklung befindet) und Google Auth ausprobiere.
Ich habe den gesamten Google Cloud-Teil konfiguriert, den Zustimmungsbildschirm mit Testbenutzern. ., Oauth2.0 mit Sha-1...
Und außerdem expo-auth-session/providers/google im React Native-Projekt implementiert und einige Anleitungen befolgt .
Ich habe auch neue Anmeldeinformationen erstellt Mit dem Befehl „eas credentials“ und dem generierten sha-1 für Android habe ich es verwendet, hier muss ich betonen, dass ich drei weitere habe, aber ich verwende nur eines, das neue (es erscheint als Standard).
Das Problem ist, dass nach dem Ausführen von npx expo run:android, obwohl ich den Zustimmungsbildschirm sehe und akzeptiere, nach dem erneuten Laden in „Antwort“ null zurückgegeben wird.Ich beziehe mich darauf Teil:

Code: Select all

React.useEffect(() => {
// This returns null response.
console.log("trigger response -> ", response)
handleSingInWithGoogle()
}, [response])
Und das ist der vollständige Code meines Logins.

Code: Select all

import React, {useContext, useEffect, useState} from 'react';
import {Form, H4, Spinner, Input, View, Text, H6} from 'tamagui'
import {Button} from "tamagui.config"
import {Pressable, SafeAreaView, Platform, Image, StyleSheet} from "react-native";
import {loadUser, login, register} from "~/services/AuthService";
import * as WebBrowser from "expo-web-browser";
import * as Google from "expo-auth-session/providers/google";
import {getUserInfo} from "~/services/GoogleAuthService";
import {useAuth} from "~/contexts/NewAuthContext";
import {useRouter} from "expo-router";

WebBrowser.maybeCompleteAuthSession();

// @ts-ignore
const Login = () => {
const { signIn } = useAuth();
const router = useRouter()
const [isLoadingLogin, setIsLoadingLogin] = useState(false)
const [email, setEmail] = useState("")
const [password, setPassword] = useState("")
const [errors, setErrors] = useState({})
// const {setUser} = useContext(AuthContext);

const [request, response, promptAsync] = Google.useAuthRequest({
androidClientId: "android id from google cloud Oauth2.0",
// expoClientId: "TU_EXPO_CLIENT_ID", // Opcional, para pruebas en Expo Go
});

React.useEffect(() => {
console.log("trigger response -> ", response)
handleSingInWithGoogle()
}, [response])

async function handleSingInWithGoogle(){
// Here the response is always "null"....
console.log("response", response)
if(response?.type === "success"){
// It never happens because it is always null...
console.log("response success", response)
const googleAccessToken = response.authentication.accessToken

const googleUserData = await getUserInfo(googleAccessToken)

try {
await register({
"email": googleUserData.email,
"name": googleUserData.given_name,
"surname": googleUserData.family_name,
"picture": googleUserData.picture,
"google_id": googleUserData.id,
"register_type": "google_auth",
"device_name": `${Platform.OS} - ${Platform.Version}`
})
const user = await loadUser();
signIn(user)
} catch (e) {
console.error("error login-in with google")
}
}
}

function validateForm() {
const newErrors = {};

if (!email.trim()) {
newErrors.email = "empty";
}

if (!password.trim()) {
newErrors.password = "empty";
}

setErrors(newErrors);
return Object.keys(newErrors).length === 0;
}

async function submitLoginForm(){
console.log("entra en submitLoginForm")
try {
setIsLoadingLogin(true)

// Solo continúa si la validación es exitosa
if (!validateForm()) {
return;  // Detiene la ejecución si hay errores
}

await login({
email,
password,
device_name: `${Platform.OS} - ${Platform.Version}`
});

const user = await loadUser();
console.info("login function user : ", user)
signIn(user)

} catch(e){
if (e.response.status === 422){
setErrors({password: "credentials not found"});
}
} finally {
setIsLoadingLogin(false)
}
}

function redirectRegister() {
setErrors({})
router.push("/(auth)/register")
}

return (

 submitLoginForm()}
backgroundColor="#e3e3e3"
padding="$10"
>
[h4]Log-in[/h4]
{/*{JSON.stringify()}*/}



 {
setEmail(text);
// Limpia el error cuando el usuario empieza a escribir
if (errors.email) {
setErrors(prev => ({ ...prev, email: null }));
}
}}
keyboardType="email-address"
autoCapitalize="none"
/>
{errors.email && El email no puede estar vacio}



{errors.password && errors.password !== 'credentials not found' && La contraseña no puede estar vacía}
{errors.password && errors.password === 'credentials not found' && No existe ningun registro con ese email y contraseña}




No tienes cuenta? Crea una ahora!


 promptAsync()}
style={({ pressed }) => ({
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
padding: 10,
borderRadius: 30,
backgroundColor: pressed ? '#f0f0f0' : '#ffffff',
borderWidth: 1,
borderColor: '#dcdcdc',
})}
>

Entrar con Google






  : undefined}>
{isLoadingLogin ? 'Iniciando sesión...' : 'Iniciar sesión'}






)
}

const styles = StyleSheet.create({
errorText: {
paddingTop: 4,
paddingLeft: 3,
color: 'red',
fontSize: 12,
},
});

export default Login;

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post