> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dodopayments.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Portal del Cliente

> Empodera a los clientes para que se autoatiendan y gestionen sus suscripciones, historial de facturación, claves de licencia y perfil de forma segura.

<Info>
  El Portal del Cliente es un área segura alojada donde tus clientes pueden gestionar suscripciones, ver facturas y acceder a los detalles de claves de licencia, sin contactar al soporte técnico.
</Info>

<CardGroup cols={2}>
  <Card title="Create Portal Session (API)" icon="code" href="/api-reference/customers/create-customer-portal-session">
    Crea programáticamente sesiones seguras del portal con límite temporal.
  </Card>

  <Card title="Subscriptions" icon="repeat" href="/features/subscription">
    Gestiona planes recurrentes, mejoras, degradaciones y complementos.
  </Card>
</CardGroup>

<br />

<Frame>
  <img src="https://mintcdn.com/dodopayments/kCngKZVrb0rZMS1f/images/customer-portal/new-portal.png?fit=max&auto=format&n=kCngKZVrb0rZMS1f&q=85&s=9431b2e24142e47cb39dc84c1a0303fe" alt="Portal de Clientes renovado mostrando suscripciones activas, métodos de pago e historial de facturación" style={{ maxHeight: '500px', width: 'auto' }} width="2876" height="1568" data-path="images/customer-portal/new-portal.png" />
</Frame>

## ¿Qué es el Portal del Cliente?

El portal proporciona una experiencia de autoatención confiable y de marca para que los clientes puedan:

* **Acceder al historial de facturación**: Ver facturas y descargar recibos.
* **Gestionar suscripciones**: Ver detalles de suscripción, cancelar suscripciones inmediatamente o en la próxima fecha de facturación.
* **Actualizar métodos de pago**: Cambiar métodos de pago para suscripciones activas o reactivar suscripciones en espera.
* **Recuperar claves de licencia**: Acceder a todas las claves vinculadas a compras.
* **Navegar con facilidad**: Usa el botón de retroceso para moverte entre secciones del portal sin perder el contexto.

## Beneficios Clave

* **Menor volumen de soporte**: Los clientes resuelven por sí mismos las solicitudes comunes de facturación
* **Tiempo más rápido a valor**: Acceso inmediato a facturas y claves
* **Reducción del riesgo de cancelación**: Visibilidad clara de las renovaciones y detalles del plan
* **Seguro por diseño**: Acceso tokenizado con enlaces que expiran
* **Experiencia localizada**: El portal está disponible en 21 idiomas, con detección automática basada en las preferencias del navegador del cliente

## Métodos de Acceso

Los clientes pueden acceder al portal utilizando un enlace estático o un enlace dinámico de un solo uso.

### Enlace estático (acceso basado en correo electrónico)

Los clientes pueden solicitar acceso al portal ingresando su correo electrónico en un enlace estático que nunca expira.

El formato del enlace estático del portal varía según el entorno:

**Modo de Prueba** (para pruebas y desarrollo):

```bash theme={null}
https://test.customer.dodopayments.com/login/{business_id}
```

**Modo en Vivo** (para producción con transacciones reales):

```bash theme={null}
https://customer.dodopayments.com/login/{business_id}
```

Reemplaza `{business_id}` con tu identificador comercial real, luego comparte el enlace apropiado con los clientes para que ingresen su correo electrónico y reciban acceso seguro al portal.

<Frame>
  <img src="https://mintcdn.com/dodopayments/kIuKVjhdOQFWlzSx/images/customer-portal/email-login.png?fit=max&auto=format&n=kIuKVjhdOQFWlzSx&q=85&s=bd8ee54177bc23e12e3657c87f487bae" alt="Pantalla de inicio de sesión basada en correo electrónico" style={{ maxHeight: '500px', width: 'auto' }} width="2880" height="1550" data-path="images/customer-portal/email-login.png" />
</Frame>

<Steps>
  <Step title="Merchant flow">
    1. Ve a Ventas → Cliente.
    2. Haz clic en <i>Compartir invitación</i>.
    3. Copia el <i>Enlace estático</i> y compártelo con tu cliente.
  </Step>

  <Step title="Customer flow">
    1. Abre el enlace estático.
    2. Introduce el correo electrónico usado en la compra.
    3. Recibe un enlace de inicio de sesión seguro para acceder al portal.

    <Check>
      Los clientes existentes son reconocidos automáticamente.
    </Check>
  </Step>
</Steps>

### Enlace dinámico (enlace mágico)

Un enlace mágico personalizado de un solo uso que envía a los clientes directamente al portal. El enlace expira en 24 horas.

<Warning>
  Los enlaces dinámicos expiran después de 24 horas. Si expira, genera y envía uno nuevo.
</Warning>

<Frame>
  <img src="https://mintcdn.com/dodopayments/kIuKVjhdOQFWlzSx/images/customer-portal/magic-link.png?fit=max&auto=format&n=kIuKVjhdOQFWlzSx&q=85&s=8e63714f40468bd6e42c811e194f2698" alt="Acceso directo con enlace mágico" style={{ maxHeight: '500px', width: 'auto' }} width="2880" height="1554" data-path="images/customer-portal/magic-link.png" />
</Frame>

<Steps>
  <Step title="Merchant flow">
    1. Ve a Ventas → Cliente.
    2. Haz clic en <i>Compartir invitación</i>.
    3. Copia el <i>Enlace dinámico</i> y compártelo con tu cliente.
  </Step>

  <Step title="Customer flow">
    1. Abre el enlace dinámico.
    2. Accede directamente al Portal del Cliente sin ingresar un correo electrónico.
  </Step>
</Steps>

## Características del Portal

El renovado Portal del Cliente ofrece una interfaz limpia y unificada con una barra lateral izquierda y secciones organizadas para todas las necesidades de gestión de cuentas.

<CardGroup cols={2}>
  <Card title="Active Subscriptions" icon="repeat">
    Consulta todas las suscripciones activas con nombre del plan, precio, fecha de renovación y vigencia. Haz clic en "Gestionar suscripción" para ver detalles, editar la información de facturación o cancelar.
  </Card>

  <Card title="Payment Methods" icon="credit-card">
    Consulta todos los métodos de pago guardados (tarjetas, UPI, etc.) de un vistazo. Edita los métodos de pago directamente desde los detalles de la suscripción.
  </Card>

  <Card title="Billing History" icon="file-invoice">
    Consulta todas las transacciones en una tabla detallada con fecha, estado, tipo de precio, derechos y facturas descargables.
  </Card>

  <Card title="Billing Information" icon="user">
    Visualiza y edita tu nombre, correo electrónico, número de teléfono y dirección de facturación desde la página de detalles de la suscripción.
  </Card>
</CardGroup>

### Vista general del portal

La página principal del portal muestra todas las suscripciones activas, los métodos de pago guardados y el historial de facturación en una única vista desplazable.

<Frame>
  <img src="https://mintcdn.com/dodopayments/kCngKZVrb0rZMS1f/images/customer-portal/new-portal.png?fit=max&auto=format&n=kCngKZVrb0rZMS1f&q=85&s=9431b2e24142e47cb39dc84c1a0303fe" alt="Página principal del Portal de Clientes mostrando suscripciones activas y métodos de pago" style={{ maxHeight: '500px', width: 'auto' }} width="2876" height="1568" data-path="images/customer-portal/new-portal.png" />
</Frame>

### Métodos de pago e historial de facturación

Desplázate hacia abajo para ver los métodos de pago guardados y un historial completo de facturación con indicadores de estado y facturas descargables.

<Frame>
  <img src="https://mintcdn.com/dodopayments/kCngKZVrb0rZMS1f/images/customer-portal/payment-methods-invoices.png?fit=max&auto=format&n=kCngKZVrb0rZMS1f&q=85&s=1aed6644dbb338cda755798eda99a6f2" alt="Métodos de pago e historial de facturación con descargas de facturas" style={{ maxHeight: '500px', width: 'auto' }} width="2880" height="1560" data-path="images/customer-portal/payment-methods-invoices.png" />
</Frame>

## Soporte de Idiomas

El Portal de Clientes está disponible en **21 idiomas**, para que tus clientes puedan gestionar sus suscripciones, métodos de pago e historial de facturación en el idioma con el que se sientan más cómodos.

### Cómo funciona la selección de idioma

* **Detección automática**: En la primera visita, el portal detecta el idioma preferido del cliente a partir de la configuración de su navegador y carga la traducción correspondiente si está disponible. El inglés se utiliza como opción predeterminada.
* **Anulación manual**: Los clientes pueden cambiar el idioma activo en cualquier momento desde el selector de idioma en el encabezado del portal (disponible tanto en escritorio como en móvil).
* **Preferencia persistente**: El idioma seleccionado se almacena en la cookie `NEXT_LOCALE` (válida por 1 año) para que el portal recuerde la elección a través de las sesiones.

### Idiomas soportados

| Idioma                  | Código | Idioma    | Código |
| ----------------------- | ------ | --------- | ------ |
| Inglés (predeterminado) | `en`   | Indonesio | `id`   |
| Árabe                   | `ar`   | Italiano  | `it`   |
| Catalán                 | `ca`   | Japonés   | `ja`   |
| Chino                   | `zh`   | Coreano   | `ko`   |
| Neerlandés              | `nl`   | Malayo    | `ms`   |
| Francés                 | `fr`   | Polaco    | `pl`   |
| Alemán                  | `de`   | Portugués | `pt`   |
| Hebreo                  | `he`   | Rumano    | `ro`   |
| Ruso                    | `ru`   | Español   | `es`   |
| Sueco                   | `sv`   | Tailandés | `th`   |
| Turco                   | `tr`   |           |        |

## Cambios de Plan (Mejora/Degradación)

Cuando los productos están organizados en **Colecciones de Productos**, los clientes pueden mejorar o degradar entre planes directamente desde el Portal de Clientes.

<Tip>
  **¿Quieres habilitar mejoras/degradaciones para suscripciones existentes?** Añade tus productos de suscripción a una Colección de Productos. Una vez agrupados, los clientes pueden cambiar entre planes en la misma colección a través del Portal de Clientes.
</Tip>

### Acciones Disponibles

| Acción          | Descripción                                              | Cuándo está disponible                                  |
| --------------- | -------------------------------------------------------- | ------------------------------------------------------- |
| **Mejora**      | Cambio a un plan de nivel superior en la misma colección | El negocio ha habilitado actualizaciones de suscripción |
| **Degradación** | Cambio a un plan de nivel inferior en la misma colección | El negocio ha habilitado actualizaciones de suscripción |

### Cómo Funcionan los Cambios de Plan

1. El cliente ve su suscripción actual en el portal
2. Se muestran las opciones de mejora/degradación disponibles según la colección de productos
3. El cliente selecciona el nuevo plan
4. Se calcula la prorrata y el pago se procesa inmediatamente (si corresponde)
5. La suscripción se actualiza al nuevo plan

<Info>
  Los cambios de plan solo están disponibles entre productos dentro de la misma colección. Los productos deben ser tipos de facturación por suscripción o por uso.
</Info>

### Controles del Negocio

Los negocios pueden configurar el comportamiento de cambio de plan en Configuración de Suscripción:

* **Permitir Actualizaciones de Suscripción**: Habilitar o deshabilitar la capacidad de los clientes para mejorar o degradar sus suscripciones

<Card title="Product Collections" icon="layer-group" href="/features/product-collections">
  Aprende cómo configurar colecciones de productos y configurar rutas de mejora/degradación.
</Card>

## Detalles de Suscripción

Cuando los clientes hacen clic en "Gestionar suscripción" en cualquier suscripción activa, se dirigen a la página de detalles de la suscripción. Esta página muestra:

* **Detalles del plan**: Nombre de la suscripción, precio, fecha de renovación y período de validez
* **Método de pago**: La tarjeta o método de pago vinculado a la suscripción, con un botón "Editar"
* **Información de facturación**: Nombre, correo electrónico, número de teléfono y dirección de facturación con un botón "Editar"
* **Historial de facturación**: Una tabla detallada de todos los pagos de esta suscripción
* **Cancelar Suscripción**: Un botón destacado para cancelar la suscripción

<Frame>
  <img src="https://mintcdn.com/dodopayments/kCngKZVrb0rZMS1f/images/customer-portal/subscription-details.png?fit=max&auto=format&n=kCngKZVrb0rZMS1f&q=85&s=4ae46f6878c9343b2e963c516952c9d3" alt="Página de detalles de la suscripción mostrando información del plan, método de pago, información de facturación y opción para cancelar" style={{ maxHeight: '500px', width: 'auto' }} width="2880" height="1560" data-path="images/customer-portal/subscription-details.png" />
</Frame>

## Cancelación de una Suscripción

Los clientes pueden cancelar su suscripción directamente desde la página de detalles de la suscripción. Al hacer clic en "Cancelar Suscripción" se abre un cuadro de diálogo de confirmación con dos opciones:

* **Cancelar en la próxima fecha de facturación**: La suscripción permanece activa hasta que finalice el período de facturación actual y luego se cancela automáticamente.
* **Cancelar ahora**: La suscripción se cancela inmediatamente.

<Frame>
  <img src="https://mintcdn.com/dodopayments/kCngKZVrb0rZMS1f/images/customer-portal/cance-sub.png?fit=max&auto=format&n=kCngKZVrb0rZMS1f&q=85&s=66eb6e380c991826c431fd0c563cbfa6" alt="Diálogo de cancelación de suscripción con opciones para cancelar en la próxima fecha de facturación o cancelar inmediatamente" style={{ maxHeight: '500px', width: 'auto' }} width="2880" height="1550" data-path="images/customer-portal/cance-sub.png" />
</Frame>

### Motivos de Cancelación

Antes de confirmar la cancelación, se les pregunta a los clientes **"¿Por qué estás cancelando?"** y se les pide que elijan un motivo de una lista seleccionada. El motivo se almacena en la suscripción y se muestra en las cargas útiles de webhook y en la API, para que puedas analizar los motivos de cancelación y adaptar tus flujos de recuperación.

<Frame>
  <img src="https://mintcdn.com/dodopayments/RlXcM7JO-E_w40Np/images/customer-portal/cancellation-reasons.png?fit=max&auto=format&n=RlXcM7JO-E_w40Np&q=85&s=979394da2a9aa3907cbf9f4e225f9a4b" alt="Modal de cancelación con el desplegable '¿Por qué estás cancelando?' mostrando razones como Demasiado caro, Faltan características y Otro" style={{ maxHeight: '500px', width: 'auto' }} width="2880" height="1564" data-path="images/customer-portal/cancellation-reasons.png" />
</Frame>

| Valor              | Etiqueta visible para el cliente |
| ------------------ | -------------------------------- |
| `too_expensive`    | Demasiado caro                   |
| `missing_features` | Faltan características           |
| `switched_service` | Cambiado a otro servicio         |
| `unused`           | No lo usa suficiente             |
| `customer_service` | Mal servicio al cliente          |
| `low_quality`      | Baja calidad                     |
| `too_complex`      | Demasiado complejo               |
| `other`            | Otro                             |

El valor seleccionado se escribe en el campo `cancellation_feedback` de la suscripción. También se puede capturar un `cancellation_comment` libre opcional.

```typescript theme={null}
// Read the captured feedback after a customer cancels
const subscription = await client.subscriptions.retrieve('sub_123');
console.log(subscription.cancellation_feedback); // e.g., "too_expensive"
console.log(subscription.cancellation_comment);  // e.g., "Switching to a competitor"
```

Ambos campos también se incluyen en la carga útil del webhook `subscription.cancelled`, y puedes llenarlos programáticamente en `PATCH /subscriptions/{id}` al programar o ejecutar una cancelación a través de la API.

<Tip>
  Combina `cancellation_feedback` con [Subscription Dunning](/features/recovery/subscription-dunning) para personalizar los correos electrónicos de recuperación — por ejemplo, envía un código de descuento a los canceladores `too_expensive` y una encuesta "¿Qué falta?" a los canceladores `missing_features`.
</Tip>

## Actualización de Métodos de Pago

Los clientes pueden actualizar sus métodos de pago directamente desde la página de detalles de la suscripción haciendo clic en "Editar" junto al método de pago. Esta característica es especialmente importante para reactivar suscripciones que se han suspendido debido a pagos fallidos.

### Reactivación de Suscripciones Suspendidas

Cuando una suscripción se coloca en estado `on_hold` debido a un pago fallido, los clientes deben actualizar su método de pago para reactivarla. El proceso de actualización automáticamente:

1. **Crea un cargo** por las deudas restantes
2. **Genera una factura** para el cargo
3. **Procesa el pago** con el nuevo método de pago
4. **Reactiva la suscripción** al estado `active` al completar el pago exitosamente

<Warning>
  Las suscripciones en estado `on_hold` no se renovarán automáticamente. Los clientes deben actualizar su método de pago para liquidar deudas y reactivar la suscripción.
</Warning>

<Info>
  Después de actualizar satisfactoriamente el método de pago para una suscripción `on_hold`, los clientes verán una página de confirmación y recibirán notificaciones por correo electrónico sobre el pago exitoso y la reactivación de la suscripción.
</Info>

### Flujo de Actualización del Método de Pago

<Steps>
  <Step title="Access subscription details">
    Haz clic en "Gestionar suscripción" en cualquier suscripción activa desde la página de inicio del portal.
  </Step>

  <Step title="Click Edit on payment method">
    Haz clic en el botón "Editar" junto al método de pago para abrir la interfaz de actualización del método de pago.
  </Step>

  <Step title="Select or add payment method">
    Elige un método de pago guardado existente o añade uno nuevo introduciendo los datos de la tarjeta de manera segura.
  </Step>

  <Step title="Confirm changes">
    Confirma la actualización. Para suscripciones `on_hold`, esto creará automáticamente un cargo por deudas restantes.
  </Step>

  <Step title="Complete payment (if on hold)">
    Si la suscripción está en espera, los clientes serán redirigidos para completar el pago por las deudas restantes. Tras un pago exitoso, la suscripción se reactiva automáticamente.
  </Step>

  <Step title="Confirmation">
    Los clientes reciben confirmación de que el método de pago ha sido actualizado y, si es aplicable, que la suscripción ha sido reactivada.
  </Step>
</Steps>

## Ejemplos de Integración

Crea una sesión del Portal del Cliente limitada en el tiempo para un cliente específico a través de API y luego redirige al usuario a la URL de la sesión.

<CodeGroup>
  ```typescript Node.js theme={null}
  const session = await client.customers.customerPortal.create('cus_123');

  // Redirect the user to the hosted Customer Portal
  window.location.href = session.link;
  ```
</CodeGroup>

## Portal del Cliente Unificado

Además de los portales de clientes específicos de cada negocio, Dodo Payments ofrece un **Portal del Cliente Unificado** en [customer.dodopayments.com](https://customer.dodopayments.com) donde los clientes pueden ver y gestionar todas sus compras y suscripciones a través de diferentes negocios que usan Dodo Payments.

<Frame>
  <img src="https://mintcdn.com/dodopayments/eNGWg9ca-WxQ9nMf/images/changelog/unified-customer-portal.png?fit=max&auto=format&n=eNGWg9ca-WxQ9nMf&q=85&s=bceabb06ca0f00aa2a458f4af95a5cda" alt="Portal del Cliente Unificado" style={{ maxHeight: '500px', width: 'auto' }} width="1640" height="953" data-path="images/changelog/unified-customer-portal.png" />
</Frame>

### Características del Portal Unificado

* **Visibilidad entre negocios**: Ve todas las compras y suscripciones de cualquier comerciante de Dodo Payments en un solo lugar
* **Gestión centralizada**: Administra suscripciones a través de diferentes negocios desde un tablero único
* **Historial de facturación unificado**: Accede a facturas e historial de pagos de todas las compras
* **Inicio de sesión único**: Inicia sesión una vez con correo electrónico para acceder a compras de todos los comerciantes de Dodo Payments

<Tip>
  El Portal del Cliente Unificado complementa los portales específicos de negocios. Los clientes pueden usar el portal del comerciante con marca o el portal unificado según su preferencia.
</Tip>

## Solución de Problemas

* **Enlace expirado**: Genera y envía un nuevo enlace dinámico.
* **Correo electrónico no reconocido**: Pide al cliente que use el correo electrónico asociado con su compra
* **Suscripción en espera**: Si una suscripción está en espera, los clientes deben actualizar su método de pago a través del portal para liquidar deudas y reactivar la suscripción. El proceso de actualización cargará automáticamente las deudas restantes.
* **Actualización del método de pago fallida**: Si el pago falla durante el proceso de actualización para una suscripción `on_hold`, la suscripción permanecerá en espera. Los clientes pueden intentarlo nuevamente con un método de pago diferente.

<Card title="Design & Theme Customization" icon="palette" href="/features/design">
  Personaliza la apariencia de tu portal de clientes con temas predefinidos, tipografía, colores y vista previa en vivo desde la página de Diseño.
</Card>
