Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

410
Vistas
Supabase onAuthStateChanged: ¿cómo espero correctamente que la solicitud termine para evitar el parpadeo con useEffect?

Todo en cuanto a la autenticación está funcionando bien. Incluso tengo una configuración de estado de carga para que el cargador se muestre hasta que se cambie el estado, pero sigo teniendo este parpadeo al recargar. Este parpadeo solo ocurre con Supabase. Estaba usando la versión de Firebase antes y funcionó perfectamente con mi código.

Aquí hay un video de referencia: https://imgur.com/a/5hywXj5

Editar: código actualizado a la versión actual

 export default function Navigation() { const { user, setUser } = useContext(AuthenticatedUserContext); const [isLoading, setIsLoading] = useState(true); useEffect(() => { const session = supabase.auth.session(); setUser(session?.user ?? null); const { data: listener } = supabase.auth.onAuthStateChange((_: any, session: any) => { setUser(session?.user ?? null); }); setIsLoading(false); return () => { listener?.unsubscribe(); }; }, []); if (isLoading) { return ( <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}> <ActivityIndicator color={Theme.colors.purple} size="large" /> </View> ); } return ( <NavigationContainer linking={LinkingConfiguration}>{user ? <AppStack /> : <AuthStack />}</NavigationContainer> ); }
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Para recapitular para otros, onAuthStateChange no se ejecutará en la carga de la primera página, por lo que lo está activando mediante la función asíncrona getUserAuthStatus . Sin embargo, la función session() no es asíncrona e inmediatamente devolverá un resultado null si no hay una sesión de usuario, o devolverá una sesión que se haya almacenado en localStorage .

En este caso, el resultado de getUserAuthStatus siempre devolverá un valor nulo. Luego, onAuthStateChange se activará con el evento SIGNED_IN y una sesión que luego configurará al usuario.

Además, la función onAuthStateChange debe registrarse antes de realizar el paso de la sesión para capturar cualquier evento desencadenado. En la forma actual, un evento puede desencadenarse directamente después de la llamada session() pero antes de que se registre el controlador.

Entonces, para recapitular, los pasos de renderizado serán:

Paso 1

 isLoading: true user: null

Paso 2

 isLoading: false user: null

Paso 3

 isLoading false user: {...}

Por lo que puedo decir, usar la sesión directamente sin pensar que es asíncrono hará el truco.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda