Inicio de sesión con Facebook: login rápido para tus clientes

Aprenderás a activar el botón “Ingresar con Facebook” en tu sitio y a configurar correctamente una App en Meta para que el inicio de sesión funcione en producción.

Esta aplicación permite que tus clientes inicien sesión o se registren usando su cuenta de Facebook, sin crear una contraseña nueva. Con un clic, autorizan el acceso y quedan logueados automáticamente en tu sitio.

Beneficios

• Reduce fricción en registro e inicio de sesión.

• Aumenta conversiones (menos abandonos por formularios largos).

• Mejora la experiencia móvil (más rápido, menos escritura).

• Datos más confiables (nombre, email y foto según permisos).

• Menos “olvidé mi contraseña” y menos soporte.

• Percepción más profesional (login moderno y reconocido).

Pasos detallados

A) Instalar y activar la aplicación en Waclis

1. Entra al panel de tu sitio.

2. Ve a Configuración > Aplicaciones. 

3. Filtra por la categoria "Recursos extra"

4. Busca Inicio de sesión con Facebook (o “Autenticación con Facebook”).

5. Haz clic en Instalar.

6. Presiona Activar aplicación.

✅ Al activarse, se habilita el botón “Ingresar con Facebook” en:

• Pantalla de inicio de sesión

• Formulario de registro

B) Crear la App en Meta (Facebook Developers)

1. Entra a Meta for Developers (developers.facebook.com) e inicia sesión.

2. Ve a Mis apps y elige Crear app.

3. Tipo de aplicación: selecciona Consumer (Consumidor) (cuando el objetivo es login de usuarios).

4. Completa:

   • Nombre de la app (ej.: “MiSitio - Login”)

   • Email de contacto

5. Confirma Crear aplicación.

C) Agregar el producto “Facebook Login”

1. Dentro del panel de tu App, ve a Agregar producto.

2. Selecciona Facebook Login y haz clic en Configurar.

3. Elige la plataforma Web.

D) Configurar URL del sitio + dominios autorizados

1. En la configuración de la App, busca Settings / Configuración > Básica.

2. Completa:

   • Dominios de la aplicación (App Domains): tusitio.com

   • URL del sitio: https://tusitio.com

E) Cargar la “URI de redirección OAuth válida” (el paso más importante)

Meta usa una lista de Valid OAuth Redirect URIs y exige coincidencia exacta (modo estricto).

1. Ve a Facebook Login > Settings (Configuración).

2. Busca el campo Valid OAuth Redirect URIs (URI de redirección OAuth válidas).

3. Pega exactamente la URL callback que te indica Waclis en la aplicación. Ejemplo típico:

   • https://tusitio.com/auth/facebook/callback

F) Obtener credenciales (App ID y App Secret)

1. Ve a Configuración > Básica.

2. Copia:

   • App ID

   • App Secret (usa “Mostrar” para verlo)

G) Pegar credenciales en Waclis

1. Ve a Configuración > Aplicaciones > Inicio de sesión con Facebook.

2. Pega:

   • App ID

   • App Secret

3. Haz clic en Guardar.

H) Pasar la App a “En vivo (Live)”

Por defecto, Meta crea las apps en modo desarrollo, y en ese modo el login suele funcionar solo para usuarios con rol dentro de la app (admins/testers). Para que funcione para tus clientes reales, debe estar Live.

1. En el panel superior de tu App, cambia: Desarrollo → En vivo (Live).

2. Si Meta te pide completar datos faltantes (muy común), completa lo básico:

   • Email de contacto

   • URL de política de privacidad

   • Categoría de la app

   • (y lo que Meta marque como requerido)

I) Permisos recomendados

Para un login estándar, normalmente alcanza con:

• email

• public_profile

✅ No solicites permisos extra si no son necesarios: suelen exigir revisión y demorar.

J) Prueba final (checklist rápido)

1. Abre tu sitio en modo incógnito.

2. Haz clic en Ingresar con Facebook.

3. Acepta permisos.

4. Verifica que:

   • Te loguea y te lleva al sitio correctamente

   • El usuario queda creado/registrado si era nuevo

Ejemplos de casos de uso

• Tienda de indumentaria con tráfico móvil: registro en 1 clic para no perder ventas.

• Mayorista donde hay que iniciar sesión para ver precios: menos fricción al pedir acceso.

• Club de descuentos/membresías: alta rápida y con datos confiables.

Errores comunes (y cómo evitarlos)

• No pasar la App a Live → el login no funciona para clientes reales.

• Redirect URI distinta (un carácter cambia todo) → error de OAuth.

• Dominio mal cargado en App Domains → rechazos o bloqueos.

• Copiar mal el App Secret → el login no valida.

• Sitio sin HTTPS → suele generar problemas o advertencias en flujos de autenticación.