David200197

Ejemplo de Flujo de Uso de Refresh Token

A continuación te presento un ejemplo completo del flujo de autenticación usando tokens de acceso (access tokens) y tokens de actualización (refresh tokens):

1. Autenticación Inicial (Login)

Cliente → Servidor:

POST /auth/login
{

David200197

type Prettify<T> = { 
  [K in keyof T]: T[K] 
} & {};

type ToDiscoUnion<T extends Record<string, object>> = {
  [K in keyof T]: Prettify<{ type: K } && T[K]>
}[keyof T]
  
 type State = ToDiscoUnion<{
     loading: {},

David200197

// Force type expansion so they are displayed flat and readable in the editor.
export type Prettify<T> = { 
  [K in keyof T]: T[K] 
} & {};

David200197

/**
 * Utility to perform fuzzy search in an array of objects, ignoring accents, case, and word order.
 */

/**
 * Normalize a string by removing accents and converting to lowercase.
 * @param str Input string.
 * @returns Normalized string.
 */
function normalizeString(str: string): string {

David200197

Prototype Pattern

El Prototype Pattern (Patrón de Prototipo) es un patrón de diseño creacional que permite crear nuevos objetos copiando o clonando un objeto existente (el prototipo), en lugar de crear nuevos objetos desde cero. Este patrón es útil cuando la creación de un objeto es costosa en términos de recursos o tiempo, y ya tienes un objeto similar que puedes clonar.

A continuación, te muestro un ejemplo práctico del Prototype Pattern usando TypeScript. En este caso, vamos a crear un sistema de gestión de usuarios donde los usuarios pueden ser clonados para crear nuevos usuarios con propiedades similares.

---

Ejemplo: Gestión de Usuarios con Prototype Pattern

David200197

Builder Pattern

El Builder Pattern (Patrón de Construcción) es un patrón de diseño creacional que permite construir objetos complejos paso a paso. Este patrón es útil cuando un objeto tiene muchas configuraciones opcionales o parámetros, y quieres evitar constructores con muchos parámetros o múltiples constructores sobrecargados.

A continuación, te muestro un ejemplo práctico del Builder Pattern usando TypeScript. En este caso, vamos a construir un objeto Pizza con varias configuraciones opcionales (tamaño, queso, pepperoni, champiñones, etc.).

---

Ejemplo: Construcción de una Pizza con Builder Pattern

1. Definimos la clase Pizza

David200197

Strategy Pattern

El Strategy Pattern (Patrón de Estrategia) es un patrón de diseño de comportamiento que te permite definir una familia de algoritmos, encapsular cada uno de ellos y hacerlos intercambiables. Esto permite que el algoritmo varíe independientemente de los clientes que lo utilizan.

A continuación, te muestro un ejemplo práctico del Strategy Pattern usando TypeScript. En este caso, vamos a implementar un sistema de pago donde diferentes estrategias de pago (tarjeta de crédito, PayPal y criptomonedas) pueden ser intercambiables.

---

Ejemplo: Sistema de Pago con Strategy Pattern

David200197

Uso de cookies para guardar el refresh token y el access token

Ventajas de enviar ambos tokens en cookies

1. Seguridad:

   • Las cookies con HTTPOnly no pueden ser accedidas por JavaScript, lo que previene ataques XSS.
   • Las cookies con Secure solo se envían sobre conexiones HTTPS, lo que protege contra ataques de interceptación.
   • Las cookies con SameSite pueden prevenir ataques CSRF.

2. Simplicidad:

   • No necesitas manejar manualmente los tokens en el frontend (por ejemplo, almacenarlos en el localStorage o sessionStorage).

• Las cookies se envían automáticamente con cada solicitud al dominio correspondiente.

David200197

Ejemplo de cookies con http-only y segure usando express y react

Aquí te proporciono un ejemplo de cómo utilizar cookies httpOnly y secure en un backend con Express y cómo hacer una solicitud desde el frontend usando React.

Backend: Express

Instalar las dependencias necesarias:

npm install express cookie-parser

Configurar el servidor Express:

David200197

type Resolve<T> = (value: T) => void;
type Reject = (reason?: any) => void;

export const promiseResolver = <T>() => {
  let resolve: Resolve<T> = () => {};
  let reject: Reject = () => {};
  const promise = new Promise<T>((res, rej) => {
    resolve = res;
    reject = rej;
  });