Guía de Verificación Web

Un caso de uso común es autenticar al usuario en el cliente, pero también deseas validar este token y la información correspondiente del usuario en tu backend. En este caso, Sequence ofrece una función para obtener un JWT que puede ser verificado usando la biblioteca JWT de tu preferencia para tu framework. A continuación, mostramos un ejemplo utilizando nuestro Web SDK, Wagmi y un servidor Express.

Si no estás utilizando el Web SDK, sino que trabajas con el Embedded Wallet y TypeScript, puedes ir aquí para ver cómo manejar el proceso de verificación.

Un ejemplo de cliente y servidor que demuestra lo siguiente está disponible aquí

Implementación

Solicitar IdToken desde el cliente

Una vez que el usuario se ha autenticado con un Embedded Wallet en el cliente, simplemente llame a la función correspondiente para obtener un JWT de Sequence.

import { useConnect } from "wagmi";

type IdTokenResponse = {
  idToken: string;
  expiresIn: number;
};

export function GetIdToken() {
  const { connectors } = useConnect();

  const handleClick = async () => {
    const waasConnector = connectors.find(
      (connector) => "sequenceWaas" in connector
    ) as { sequenceWaas?: { getIdToken: () => Promise<IdTokenResponse> } } | undefined;

    const waas = waasConnector?.sequenceWaas;
    if (!waas) return;

    try {
      const { idToken, expiresIn } = await waas.getIdToken();
      console.log({ idToken, expiresIn });
    } catch (error) {
      console.error("Failed to get ID token:", error);
    }
  };

  return <button onClick={handleClick}>Log ID token</button>;
}

Enviar el JWT al backend

Realice una solicitud POST a su backend con el JWT recuperado.

const response = await fetch(BACKEND_ENDPOINT, {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
  },
  body: JSON.stringify({ sequenceToken: idToken }),
});

Importar bibliotecas JWT e inicializar JWKS

Desde nuestro servidor express al que se envió el JWT, simplemente importamos la biblioteca JWT preferida para verificar la información e inicializamos nuestro JWKS para la verificación. También es importante asegurarse de que la audiencia esperada esté correctamente configurada para que la reclamación se verifique adecuadamente.

import * as jwt from "jsonwebtoken";
import * as jwksClient from "jwks-rsa";

...serverConfig

// Initialize the JWKS client
const client = jwksClient({
  jwksUri: "https://waas.sequence.app/.well-known/jwks.json",
  cache: true,
  cacheMaxAge: 86400000, // 1 day
});

// Should be equal to the audience claim in the JWT that you want to verify which will be of the form https://sequence.build/project/*projectID*
const EXPECTED_AUDIENCE = "https://sequence.build/project/*PROJECT_ID*"

Decodificar el JWT y verificar los claims

Ahora podemos analizar el JWT, verificarlo contra nuestro JWKS URI y luego validar cualquiera de los claims.

const decodedToken = jwt.decode(token, { complete: true });
if (!decodedToken || typeof decodedToken === "string") {
  throw new Error("Invalid token");
}

const kid = decodedToken.header.kid;
const signingKey = await getSigningKey(kid);
const publicKey = (
  signingKey as jwksClient.CertSigningKey | jwksClient.RsaSigningKey
).getPublicKey();

console.log(EXPECTED_AUDIENCE);

const verified = jwt.verify(token, publicKey, {
  algorithms: ["RS256"], // Specify the expected algorithm
  audience: EXPECTED_AUDIENCE, // Verify the audience claim
});

  // Verifying Email claim
if (!verified.email || typeof verified.email !== "string") {
  throw new Error("Invalid email claim");
}

Actualizar su backend

A partir de aquí, ya tiene la información correspondiente al JWT verificada y puede actualizar su backend de forma segura según sea necesario.

​Implementación

Implementación