Integración híbrida

Usa la API de ADN de servidor a servidor para aprovisionar sesiones de subida y reproducción, y luego pasa los IDs de sesión a los componentes web de ADN.

Ideal para

Productos SaaS, contenido con paywall y apps multi-tenant. La configuración tarda unos 30 minutos.

Reproducir pistas

Sesiones aprovisionadas en el servidor con el componente Player de ADN.

Tu servidor usa la API de ADN (servidor a servidor) para aprovisionar sesiones de reproducción — aplicando comprobaciones de derechos, validación de suscripción, etc. — y luego pasa el ID de sesión al componente Player de ADN en el frontend. Tu backend controla quién puede reproducir; el componente gestiona la UI.

1. Crear una clave API

Ve a Settings → API Keys y crea una clave API Access.

2. Crear una sesión de reproducción (lado servidor)

const response = await fetch('https://api.audiodelivery.net/v1/play_session/collection', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_KEY',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    collection_id,
    variants: ['preview'],
    is_downloadable: false,
    expires_in: 3600 // session duration in seconds (default: 3600, min: 60, max: 86400)
  })
});

const { play_session_id, play_session, tracks } = await response.json();

Aplica aquí tu lógica de negocio — verifica que el usuario ha iniciado sesión, comprueba su suscripción, valida compras, etc.

3. Instalar e importar el componente Player

Instálalo desde npm e impórtalo una vez en el punto de entrada de tu app:

npm install @audiodn/components

import '@audiodn/components/player'

¿Sin paso de build? Cárgalo directamente desde un CDN:

<script type="module" src="https://unpkg.com/@audiodn/components@latest/dist/player.js"></script>

4. Pasar la sesión de reproducción al cliente

<audiodn-player
  play-session-id="PLAY-SESSION-ID"
></audiodn-player>

5. Reproducción del usuario

Los usuarios reproducen pistas dentro del alcance de la sesión. El acceso lo controla tu backend mientras la reproducción usa el componente Player optimizado de ADN.

Subir pistas

Sesiones aprovisionadas en el servidor con el componente Uploader de ADN.

Tu servidor usa la API de ADN (servidor a servidor) para aprovisionar sesiones de subida, y luego pasa el ID de sesión al componente Uploader de ADN en el frontend. Tu backend controla quién puede subir; el componente gestiona la UI.

1. Crear una clave API

Ve a Settings → API Keys y crea una clave API Access.

2. Crear una sesión de subida (lado servidor)

const response = await fetch('https://api.audiodelivery.net/v1/upload_session', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_KEY',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    collection_id: 'COLLECTION-ID',
    expires_in: 3600 // session duration in seconds (default: 3600, min: 60, max: 86400)
  })
});

const { upload_session } = await response.json();
const { id, collection_id, expires_at } = upload_session;

3. Instalar e importar el componente Uploader

Instálalo desde npm e impórtalo una vez en el punto de entrada de tu app:

npm install @audiodn/components

import '@audiodn/components/uploader'

¿Sin paso de build? Cárgalo directamente desde un CDN:

<script type="module" src="https://unpkg.com/@audiodn/components@latest/dist/uploader.js"></script>

4. Pasar la sesión de subida al cliente

<audiodn-uploader
  upload-session-id="UPLOAD-SESSION-ID"
  accent-color="#ff00ff"
></audiodn-uploader>

5. Flujo de subida del usuario

Los usuarios suben archivos directamente a través del componente. Por cada archivo, el componente <audiodn-uploader> hace la solicitud por pista (POST /v1/upload/:upload_session_id/track) y la subida directa por ti — tu servidor solo necesita aprovisionar la sesión de subida. ADN procesa entonces las variantes automáticamente.

6. Opcional: Webhooks

Habilita un webhook en Settings → Webhook para recibir un evento cuando una pista alcanza un resultado terminal (ready, incomplete, error o init_error) y cuando su conjunto completo de archivos está listo. Consulta la documentación del webhook Track Processing.