# CDN Público

El CDN público de Dinaup permite servir imágenes de forma rápida y global a través de `storage.dinaup.com`. Estas imágenes son accesibles públicamente sin autenticación, ideales para catálogos de productos, webs, marketplaces o cualquier contenido que necesite ser visible externamente.

{% hint style="warning" %}
Los archivos en el CDN público son **accesibles por cualquier persona** que tenga el enlace. No subas documentos confidenciales a la galería pública.
{% endhint %}

## Origen de las imágenes

Las imágenes del CDN público provienen de tres fuentes principales:

| Origen                | Descripción                                                                              |
| --------------------- | ---------------------------------------------------------------------------------------- |
| **Galería Pública**   | Imágenes subidas a la `PublicGallery` de cualquier registro (productos, servicios, etc.) |
| **Iconos de Sección** | Iconos configurados para las secciones del sistema                                       |
| **Iconos de Campo**   | Iconos asociados a campos específicos                                                    |

## Estructura de las URLs

```
https://storage.dinaup.com/cdn/{GUID}_{tamaño}.{extensión}
```

Donde:

* `{GUID}`: Identificador único del archivo
* `{tamaño}`: Sufijo opcional que indica el tamaño de la imagen
* `{extensión}`: Formato del archivo (jpg, png, webp, etc.)

## Tamaños disponibles

Dinaup genera automáticamente varias versiones de cada imagen para optimizar la carga según el contexto de uso:

| Sufijo         | Tamaño       | Uso recomendado                           |
| -------------- | ------------ | ----------------------------------------- |
| *(sin sufijo)* | **Original** | Máxima calidad, descarga, impresión       |
| `_04`          | 32px alto    | Iconos, avatares en listas, tablas        |
| `_02`          | 100px alto   | Miniaturas, previews, catálogos compactos |
| `_03`          | 300px alto   | Tarjetas de producto, galerías            |
| `_06`          | 720px alto   | Visualización en detalle, webs responsive |
| `_05`          | 1080px alto  | Pantalla completa, alta calidad           |

## Ejemplos de uso

Dada una imagen con GUID `6c535438-f09f-45d1-be28-dd538ed47b59`:

```
# Original (máxima calidad)
https://storage.dinaup.com/cdn/6c535438-f09f-45d1-be28-dd538ed47b59.jpg

# Icono pequeño (32px)
https://storage.dinaup.com/cdn/6c535438-f09f-45d1-be28-dd538ed47b59_04.jpg

# Miniatura (100px)
https://storage.dinaup.com/cdn/6c535438-f09f-45d1-be28-dd538ed47b59_02.jpg

# Tarjeta (300px)
https://storage.dinaup.com/cdn/6c535438-f09f-45d1-be28-dd538ed47b59_03.jpg

# HD (720px)
https://storage.dinaup.com/cdn/6c535438-f09f-45d1-be28-dd538ed47b59_06.jpg

# Full HD (1080px)
https://storage.dinaup.com/cdn/6c535438-f09f-45d1-be28-dd538ed47b59_05.jpg
```

## Casos de uso típicos

### Catálogo de productos en web

```html
<!-- Listado con miniaturas -->
<img src="https://storage.dinaup.com/cdn/{guid}_02.jpg" alt="Producto">

<!-- Detalle del producto -->
<img src="https://storage.dinaup.com/cdn/{guid}_05.jpg" alt="Producto">
```

### Imágenes responsive

```html
<img 
  src="https://storage.dinaup.com/cdn/{guid}_03.jpg"
  srcset="
    https://storage.dinaup.com/cdn/{guid}_02.jpg 100w,
    https://storage.dinaup.com/cdn/{guid}_03.jpg 300w,
    https://storage.dinaup.com/cdn/{guid}_06.jpg 720w,
    https://storage.dinaup.com/cdn/{guid}_05.jpg 1080w
  "
  sizes="(max-width: 600px) 300px, 720px"
  alt="Producto"
>
```

### Iconos en interfaces

```html
<!-- Avatar en tabla -->
<img src="https://storage.dinaup.com/cdn/{guid}_04.jpg" width="32" height="32">

<!-- Icono en menú -->
<img src="https://storage.dinaup.com/cdn/{guid}_02.jpg" width="48" height="48">
```

## Buenas prácticas

{% hint style="success" %}
**Optimiza la carga**: Usa siempre el tamaño más pequeño que cumpla con tus necesidades. Reserva el original solo para descarga o impresión.
{% endhint %}

* **Listados con muchos elementos**: Usa `_04` (32px) o `_02` (100px)
* **Tarjetas y galerías**: Usa `_03` (300px)
* **Visualización en detalle**: Usa `_06` (720px)
* **Pantalla completa o alta calidad**: Usa `_05` (1080px) o el original
* **Descarga o impresión**: Usa el original (sin sufijo)

## Subir imágenes a la Galería Pública

Las imágenes se suben mediante el sistema de anotaciones de Dinaup usando el tipo `PublicGallery`:

```csharp
// Subir archivo
var upload = await dinaupClient.File_UploadBytesAsync(
    dinaupClient.DefaultSession,
    imageBytes,
    "producto.jpg"
);

// Añadir a la galería pública de un registro
await dinaupClient.Annotation_PutAsync(
    dinaupClient.DefaultSession,
    sectionId,
    rowId.ToString(),
    upload.FileId,
    "Foto principal del producto",
    AnnotationTypeE.PublicGallery
);
```

{% hint style="info" %}
Una vez subida la imagen, Dinaup genera automáticamente todas las versiones de tamaño. Puedes acceder a cualquiera de ellas añadiendo el sufijo correspondiente a la URL.
{% endhint %}

## FAQ

<details>

<summary>¿Las imágenes tienen caché?</summary>

Sí, el CDN de Dinaup utiliza caché global para servir las imágenes con la menor latencia posible.

</details>

<details>

<summary>¿Puedo subir otros formatos además de imágenes?</summary>

Sí, pero la galería pública está optimizada para imágenes. Para otros tipos de archivos, usa el sistema de archivos privados con URLs firmadas.

</details>

<details>

<summary>¿Qué pasa si la imagen original es más pequeña que el tamaño solicitado?</summary>

Se sirve la imagen en su tamaño original sin ampliar, para evitar pérdida de calidad.

</details>

<details>

<summary>¿Hay límite de tamaño para las imágenes?</summary>

El límite depende de tu plan de almacenamiento.

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://doc.dinaup.com/recursos/cdn-publico.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.