Saltar al contenido principal

Una publicación etiquetados con "zkLogin"

Ver Todas las Etiquetas

Rampa sin fricción con zkLogin

· 7 min de lectura
Dora Noda
Software Engineer

Cómo eliminar la fricción de la cartera, mantener a los usuarios en flujo y pronosticar el potencial

¿Qué pasaría si tu aplicación Web3 tuviera el mismo flujo de registro sin fricciones que un servicio Web2 moderno? Esa es la promesa central de zkLogin en la blockchain Sui. Funciona como OAuth para Sui, permitiendo a los usuarios iniciar sesión con cuentas familiares de Google, Apple, X y más. Una prueba de conocimiento cero enlaza de forma segura esa identidad Web2 con una dirección Sui en cadena—sin ventanas emergentes de cartera, sin frases semilla, sin abandono de usuarios.

El impacto es real e inmediato. Con cientos de miles de cuentas zkLogin ya activas, los estudios de caso reportan ganancias masivas en la conversión de usuarios, pasando de un desalentador 17 % a un saludable 42 % después de eliminar las barreras tradicionales de la cartera. Analicemos cómo funciona y qué puede hacer por tu proyecto.


Por qué las carteras matan la conversión en el primer uso

Has creado una dApp revolucionaria, pero tu embudo de adquisición de usuarios está perdiendo gente. El culpable casi siempre es el mismo: el botón “Conectar cartera”. La incorporación estándar en Web3 es un laberinto de instalaciones de extensiones, advertencias de frases semilla y cuestionarios de jerga cripto.

Es una barrera enorme para los recién llegados. Investigadores de UX observaron una caída asombrosa del 87 % en el momento en que apareció el aviso de la cartera. En un experimento revelador, simplemente reencaminar ese aviso a una etapa posterior del proceso de pago elevó la tasa de finalización al 94 %. Incluso para los usuarios curiosos por cripto, el miedo principal es: “Podría perder mis fondos si hago clic en el botón equivocado.” Eliminar ese único paso intimidante es la clave para desbloquear un crecimiento exponencial.


Cómo funciona zkLogin (en lenguaje sencillo)

zkLogin elude elegantemente el problema de la cartera usando tecnologías en las que todo usuario de internet ya confía. La magia ocurre tras bambalinas en unos pocos pasos rápidos:

  1. Par de claves efímero: Cuando un usuario quiere iniciar sesión, se genera localmente en su navegador un par de claves temporal de una sola sesión. Piensa en ello como una llave de paso temporal, válida solo para esa sesión.
  2. Danza OAuth: El usuario inicia sesión con su cuenta de Google, Apple u otra red social. Tu aplicación inserta de forma inteligente un valor único (nonce) en esta solicitud de inicio de sesión.
  3. Servicio ZKP: Tras un inicio de sesión exitoso, un servicio ZKP (Prueba de Conocimiento Cero) genera una prueba criptográfica. Esta prueba confirma, “Este token OAuth autoriza al propietario de la llave temporal,” sin revelar nunca la identidad personal del usuario en cadena.
  4. Derivar dirección: El JWT (JSON Web Token) del proveedor OAuth se combina con una sal única para generar de forma determinista su dirección permanente en Sui. La sal se mantiene privada, ya sea del lado del cliente o en un backend seguro.
  5. Enviar transacción: Tu aplicación firma transacciones con la llave temporal y adjunta la prueba ZK. Los validadores de Sui verifican la prueba en cadena, confirmando la legitimidad de la transacción sin que el usuario necesite una cartera tradicional.

Guía de integración paso a paso

¿Listo para implementarlo? Aquí tienes una guía rápida usando el SDK de TypeScript. Los principios son idénticos para Rust o Python.

1. Instalar SDK

El paquete @mysten/sui incluye todos los helpers zklogin que necesitarás.

pnpm add @mysten/sui

2. Generar claves y nonce

Primero, crea un par de claves efímero y un nonce ligado a la época actual en la red Sui.

const keypair = new Ed25519Keypair();
const { epoch } = await suiClient.getLatestSuiSystemState();
const nonce = generateNonce(
keypair.getPublicKey(),
Number(epoch) + 2,
generateRandomness(),
);

3. Redirigir a OAuth

Construye la URL de inicio de sesión OAuth adecuada para el proveedor que estés usando (por ejemplo, Google, Facebook, Apple) y redirige al usuario.

4. Decodificar JWT y obtener la sal del usuario

Después de que el usuario inicie sesión y sea redirigido de vuelta, captura el id_token de la URL. Úsalo para obtener la sal específica del usuario desde tu backend, y luego deriva su dirección Sui.

const jwt = new URLSearchParams(window.location.search).get("id_token")!;
const salt = await fetch("/api/salt?jwt=" + jwt).then((r) => r.text());
const address = jwtToAddress(jwt, salt);

5. Solicitar prueba ZK

Envía el JWT a un servicio de pruebas para obtener la prueba ZK. Para desarrollo, puedes usar el probador público de Mysten. En producción, deberías alojar el tuyo propio o usar un servicio como Enoki.

const proof = await fetch('/api/prove', {
method:'POST',
body: JSON.stringify({ jwt, ... })
}).then(r => r.json());

6. Firmar y enviar

Ahora, construye tu transacción, establece al remitente la dirección zkLogin del usuario y ejecútala. El SDK se encarga de adjuntar automáticamente los zkLoginInputs (la prueba). ✨

const tx = new TransactionBlock();
tx.moveCall({ target: "0x2::example::touch_grass" }); // Any Move call
tx.setSender(address);
tx.setGasBudget(5_000_000);

await suiClient.signAndExecuteTransactionBlock({
transactionBlock: tx,
zkLoginInputs: proof, // The magic happens here
});

7. Persistir la sesión

Para una experiencia de usuario más fluida, cifra y almacena el par de claves y la sal en IndexedDB o local storage. Recuerda rotarlos cada pocas épocas para mejorar la seguridad.


Plantilla de proyección de KPI

La diferencia que zkLogin genera no es solo cualitativa; es cuantificable. Compara un embudo de incorporación típico con uno potenciado por zkLogin:

Etapa del embudoTípico con ventana emergente de carteraCon zkLoginDelta
Landing → Sign-in100 %100 %
Sign-in → Wallet Ready15 % (instalar, frase semilla)55 % (login social)+40 pp
Wallet Ready → First Tx\ 23 %\ 90 %+67 pp
Overall Tx Conversion\ 3 %≈ 25‑40 %\ 8‑13×

👉 Qué significa esto: Para una campaña que atraiga 10 000 visitantes únicos, esa es la diferencia entre 300 acciones en cadena el primer día y más de 2 500.


Buenas prácticas y advertencias

Para crear una experiencia aún más fluida, ten en cuenta estos consejos profesionales:

  • Usa transacciones patrocinadas: Paga las primeras tarifas de transacción de tus usuarios. Esto elimina toda fricción y genera un momento “¡ajá!” increíble.
  • Maneja las sales con cuidado: Cambiar la sal de un usuario generará una nueva dirección. Hazlo solo si controlas una ruta de recuperación fiable para él.
  • Expón la dirección Sui: Después del registro, muestra a los usuarios su dirección en cadena. Esto empodera a los usuarios avanzados para importarla a una cartera tradicional más adelante, si lo desean.
  • Previene bucles de recarga: Cachea el JWT y el par de claves efímero hasta que expiren para evitar pedir al usuario que inicie sesión repetidamente.
  • Monitorea la latencia del probador: Vigila el tiempo de ida y vuelta de la generación de pruebas. Si supera los 2 segundos, considera alojar un probador regional para mantener la experiencia ágil.

Dónde BlockEden.xyz aporta valor

Mientras zkLogin perfecciona el flujo de cara al usuario, escalarlo introduce nuevos retos de backend. Ahí es donde entra BlockEden.xyz.

  • Capa API: Nuestros nodos RPC de alta capacidad y enrutamiento geográfico garantizan que tus transacciones zkLogin se procesen con latencia mínima, sin importar la ubicación del usuario.
  • Observabilidad: Obtén paneles listos para usar que rastrean métricas clave como latencia de pruebas, ratios de éxito/fracaso y la salud de tu embudo de conversión.
  • Cumplimiento: Para apps que conectan con fiat, nuestro módulo opcional de KYC brinda una incorporación regulada directamente desde la identidad verificada del usuario.

¿Listo para lanzar?

La era de los flujos de cartera torpes e intimidantes ha terminado. Levanta un sandbox zkLogin, conecta el endpoint de nodo completo de BlockEden y observa cómo tu gráfico de registros se curva hacia arriba—mientras tus usuarios ni siquiera escuchan la palabra “cartera”. 😉