Subir pistas

Elige quién crea o autoriza la sesión de subida y — si tu servidor la crea — cómo se transfieren los archivos. La reproducción es una decisión aparte; consulta Reproducir y acceder a pistas.

Ciclo de vida de subida por archivo

Una sesión de subida puede autorizar muchos archivos, pero cada archivo necesita su propia pista y URL de subida. Crea la sesión y, para cada archivo, llama a POST /v1/upload/{upload_session_id}/track y haz PUT de los bytes a track_upload.upload_url. Opcionalmente incluye un track anidado al crear la sesión para el primer archivo. Referencia completa: Upload Sessions.

Subir tracks

Elige quién crea la upload session y luego — si hace falta — cómo se transfieren los archivos. Las elecciones de carga y reproducción son independientes.

¿Quién debe crear o autorizar la upload session?

Componentes web AudioDN Uploader o (voice) Recorder La configuración más rápida. Componentes web con una Client-Side Upload key acotada; gestionan la creación de la sesión y la transferencia. El (voice) Recorder captura desde el micrófono. Tu navegador o aplicación nativa Una Client-Side Upload key acotada. Tu app crea la upload session y sube cada archivo a la URL proporcionada. Tu servidor Una API Access key en tu servidor. Tu servidor aplica la autorización específica de la aplicación y crea una upload session de corta duración.

¿Cómo debe el usuario transferir los archivos?

Componentes web AudioDN Uploader o (voice) Recorder Pasa la upload session creada en el servidor al componente web AudioDN Uploader o (voice) Recorder. Interfaz de carga personalizada en navegador o nativa Usa la información de carga proporcionada en tu propia UI de carga.

AudioDN Uploader o (voice) Recorder (componentes web) con una Client-Side Upload key

Configuración más rápida. Una Client-Side Upload key con alcance; el componente crea la sesión y sube cada archivo.

Crear una Client-Side Upload key

En el dashboard ve a Settings → API Keys y crea una clave Client-Side Upload. Opcionalmente limítala a una colección. Esta clave solo puede crear sesiones de subida — no leer ni eliminar pistas.

Instalar el componente web

npm install @audiodn/components

Uploader:

import '@audiodn/components/uploader'

O (voice) Recorder:

import '@audiodn/components/recorder'

Alternativas CDN:

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

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

Renderizar el componente web

<audiodn-uploader
  api-key="CLIENT-SIDE-UPLOAD-KEY"
  collection-id="COLLECTION-ID"
  accent-color="#ff00ff"
></audiodn-uploader>

<audiodn-recorder
  api-key="CLIENT-SIDE-UPLOAD-KEY"
  collection-id="COLLECTION-ID"
  accent-color="#ff00ff"
></audiodn-recorder>

Si la clave está limitada a una colección, puedes omitir collection-id. Nunca establezcas ambos api-key y upload-session-id.

Qué hace el componente web

Para cada archivo, el componente crea (o reutiliza) una sesión de subida, llama a POST /v1/upload/:upload_session_id/track y sube los bytes a track_upload.upload_url. Luego AudioDN procesa las variantes configuradas.

Opcional: configura un webhook de track-processing para saber cuándo una pista está lista.

Subida personalizada en el cliente con una Client-Side Upload key

Tu navegador o app nativa crea la sesión de subida y sube cada archivo. Tú construyes la interfaz.

Crear una Client-Side Upload key

Crea una clave Client-Side Upload con alcance en el dashboard. Segura para incrustar en la app. Nunca uses una API Access key en código de cliente.

Crear una sesión de subida

const response = await fetch('https://api.audiodelivery.net/v1/upload_session', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer CLIENT-SIDE-UPLOAD-KEY',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ collection_id: 'COLLECTION-ID', expires_in: 3600 })
});
const { upload_session_id } = await response.json();

var request = URLRequest(url: URL(string: "https://api.audiodelivery.net/v1/upload_session")!)
request.httpMethod = "POST"
request.setValue("Bearer CLIENT-SIDE-UPLOAD-KEY", forHTTPHeaderField: "Authorization")
request.setValue("application/json", forHTTPHeaderField: "Content-Type")
request.httpBody = try JSONEncoder().encode(["collection_id": "COLLECTION-ID", "expires_in": 3600])
let (data, _) = try await URLSession.shared.data(for: request)
// Decode upload_session_id from data

val body = """{"collection_id":"COLLECTION-ID","expires_in":3600}"""
  .toRequestBody("application/json".toMediaType())
val request = Request.Builder()
  .url("https://api.audiodelivery.net/v1/upload_session")
  .post(body)
  .addHeader("Authorization", "Bearer CLIENT-SIDE-UPLOAD-KEY")
  .build()
val response = client.newCall(request).execute()
// Parse upload_session_id from response body

final response = await http.post(
  Uri.parse('https://api.audiodelivery.net/v1/upload_session'),
  headers: {
    'Authorization': 'Bearer CLIENT-SIDE-UPLOAD-KEY',
    'Content-Type': 'application/json',
  },
  body: jsonEncode({'collection_id': 'COLLECTION-ID', 'expires_in': 3600}),
);
final json = jsonDecode(response.body) as Map<String, dynamic>;
final uploadSessionId = json['upload_session_id'] as String;

Crear una pista por cada archivo

const response = await fetch(
  `https://api.audiodelivery.net/v1/upload/${upload_session_id}/track`,
  {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ file_name: 'song.wav' })
  }
);
const { track_id, track_upload } = await response.json();
const { method, upload_url } = track_upload;

var request = URLRequest(url: URL(string: "https://api.audiodelivery.net/v1/upload/\(sessionId)/track")!)
request.httpMethod = "POST"
request.setValue("application/json", forHTTPHeaderField: "Content-Type")
request.httpBody = try JSONEncoder().encode(["file_name": "recording.m4a"])
let (data, _) = try await URLSession.shared.data(for: request)
// Decode track_upload.upload_url and method

val body = """{"file_name":"recording.m4a"}""".toRequestBody("application/json".toMediaType())
val request = Request.Builder()
  .url("https://api.audiodelivery.net/v1/upload/$uploadSessionId/track")
  .post(body)
  .build()
val response = client.newCall(request).execute()
// Parse track_upload.upload_url

final response = await http.post(
  Uri.parse('https://api.audiodelivery.net/v1/upload/$uploadSessionId/track'),
  headers: {'Content-Type': 'application/json'},
  body: jsonEncode({'file_name': 'recording.m4a'}),
);
final trackUpload = (jsonDecode(response.body) as Map)['track_upload'] as Map;
final uploadUrl = trackUpload['upload_url'] as String;

También puedes incluir un objeto track anidado al crear la sesión para el primer archivo, y luego usar este paso para archivos adicionales. La URL de subida está en track_upload.upload_url (no en el objeto track).

Subir los bytes

await fetch(upload_url, {
  method,
  headers: { 'Content-Type': file.type },
  body: file
});

var request = URLRequest(url: uploadURL)
request.httpMethod = method
request.setValue("audio/mp4", forHTTPHeaderField: "Content-Type")
request.httpBodyStream = InputStream(url: fileURL)
let (_, response) = try await URLSession.shared.data(for: request)
print((response as! HTTPURLResponse).statusCode) // 200 on success

val fileBody = File(filePath).asRequestBody("audio/mp4".toMediaType())
val request = Request.Builder()
  .url(uploadUrl)
  .put(fileBody)
  .addHeader("Content-Type", "audio/mp4")
  .build()
client.newCall(request).execute().code

final response = await http.put(
  Uri.parse(uploadUrl),
  headers: {'Content-Type': 'audio/mp4'},
  body: await File(filePath).readAsBytes(),
);

Esperar el procesamiento

Consulta GET /v1/track/{track_id} hasta que track.track_status_id sea ready (requiere una API Access key o el dashboard), o usa un webhook. Las Client-Side Upload keys no pueden leer el estado de la pista — prefiere webhooks o un sondeo en el servidor para la disponibilidad.

Sesión de subida creada en el servidor con el AudioDN Uploader o (voice) Recorder (componentes web)

Tu servidor autoriza la subida, crea una sesión de corta duración y la pasa al componente.

Mantén una API Access key en tu servidor

Crea una clave API Access en el dashboard. Nunca la envíes al navegador ni a la app móvil.

Autorizar y luego crear una sesión de subida

Aplica tus propias comprobaciones (inicio de sesión, cuota, permisos) y luego:

const response = await fetch('https://api.audiodelivery.net/v1/upload_session', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_ACCESS_KEY',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    collection_id: 'COLLECTION-ID',
    expires_in: 3600
    // Optional: track: { file_name: 'song.wav' } to also create the first track
  })
});

const { upload_session_id, upload_session } = await response.json();
// Pass upload_session_id to the client (Uploader) or continue with per-track create.

Pasar la sesión al componente web

npm install @audiodn/components

import '@audiodn/components/uploader'

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

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

Usa solo upload-session-id — no establezcas también api-key.

El componente web sube

El Uploader o (voice) Recorder (componente web) realiza por ti la creación por pista y la subida de bytes. Opcional: webhook para la disponibilidad.

Sesión de subida creada en el servidor con una interfaz personalizada

Tu servidor crea la sesión; tu UI web o nativa personalizada crea pistas y sube archivos.

Mantén una API Access key en tu servidor

Crea una clave API Access. Solo en el servidor.

Crear una sesión de subida en el servidor

const response = await fetch('https://api.audiodelivery.net/v1/upload_session', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_ACCESS_KEY',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    collection_id: 'COLLECTION-ID',
    expires_in: 3600
    // Optional: track: { file_name: 'song.wav' } to also create the first track
  })
});

const { upload_session_id, upload_session } = await response.json();
// Pass upload_session_id to the client (Uploader) or continue with per-track create.

Devuelve upload_session_id al cliente. No devuelvas la API Access key.

Crear una pista por cada archivo (cliente o servidor)

const response = await fetch(
  `https://api.audiodelivery.net/v1/upload/${upload_session_id}/track`,
  {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ file_name: 'song.wav' })
  }
);
const { track_id, track_upload } = await response.json();
const { method, upload_url } = track_upload;

var request = URLRequest(url: URL(string: "https://api.audiodelivery.net/v1/upload/\(sessionId)/track")!)
request.httpMethod = "POST"
request.setValue("application/json", forHTTPHeaderField: "Content-Type")
request.httpBody = try JSONEncoder().encode(["file_name": "recording.m4a"])
let (data, _) = try await URLSession.shared.data(for: request)
// Decode track_upload.upload_url and method

val body = """{"file_name":"recording.m4a"}""".toRequestBody("application/json".toMediaType())
val request = Request.Builder()
  .url("https://api.audiodelivery.net/v1/upload/$uploadSessionId/track")
  .post(body)
  .build()
val response = client.newCall(request).execute()
// Parse track_upload.upload_url

final response = await http.post(
  Uri.parse('https://api.audiodelivery.net/v1/upload/$uploadSessionId/track'),
  headers: {'Content-Type': 'application/json'},
  body: jsonEncode({'file_name': 'recording.m4a'}),
);
final trackUpload = (jsonDecode(response.body) as Map)['track_upload'] as Map;
final uploadUrl = trackUpload['upload_url'] as String;

Subir los bytes

await fetch(upload_url, {
  method,
  headers: { 'Content-Type': file.type },
  body: file
});

var request = URLRequest(url: uploadURL)
request.httpMethod = method
request.setValue("audio/mp4", forHTTPHeaderField: "Content-Type")
request.httpBodyStream = InputStream(url: fileURL)
let (_, response) = try await URLSession.shared.data(for: request)
print((response as! HTTPURLResponse).statusCode) // 200 on success

val fileBody = File(filePath).asRequestBody("audio/mp4".toMediaType())
val request = Request.Builder()
  .url(uploadUrl)
  .put(fileBody)
  .addHeader("Content-Type", "audio/mp4")
  .build()
client.newCall(request).execute().code

final response = await http.put(
  Uri.parse(uploadUrl),
  headers: {'Content-Type': 'audio/mp4'},
  body: await File(filePath).readAsBytes(),
);

Esperar hasta que esté lista

// Processing starts automatically. Poll until ready, or use a webhook.
let track;
do {
  await new Promise((r) => setTimeout(r, 5000));
  const res = await fetch(`https://api.audiodelivery.net/v1/track/${track_id}`, {
    headers: { 'Authorization': 'Bearer YOUR_API_ACCESS_KEY' }
  });
  ({ track } = await res.json());
} while (track.track_status_id !== 'ready');

O usa el webhook de track-processing en lugar de sondear.

Subir pistas

Ciclo de vida de subida por archivo

Subir tracks

AudioDN Uploader o (voice) Recorder (componentes web) con una Client-Side Upload key

Crear una Client-Side Upload key

Instalar el componente web

Renderizar el componente web

Qué hace el componente web

Subida personalizada en el cliente con una Client-Side Upload key

Crear una Client-Side Upload key

Crear una sesión de subida

Crear una pista por cada archivo

Subir los bytes

Esperar el procesamiento

Sesión de subida creada en el servidor con el AudioDN Uploader o (voice) Recorder (componentes web)

Mantén una API Access key en tu servidor

Autorizar y luego crear una sesión de subida

Pasar la sesión al componente web

El componente web sube

Sesión de subida creada en el servidor con una interfaz personalizada

Mantén una API Access key en tu servidor

Crear una sesión de subida en el servidor

Crear una pista por cada archivo (cliente o servidor)

Subir los bytes

Esperar hasta que esté lista

Referencias relacionadas