Besuchern einen Clip zur Vorschau anbieten

Biete von jeder Spur eine kurze öffentliche Probe an. Lade eine Audiodatei hoch, erzeuge eine Preview-Variante und bette den AudioDN-Player ein, sodass Besucher die Waveform der gesamten Spur sehen, während die Wiedergabe auf das Clip-Fenster beschränkt ist.

Wenn die aktive Variante isPreview: true hat, mappt der Player seinen abspielbaren Bereich auf preview.offsetStart–preview.offsetEnd bezogen auf die Gesamtdauer der Spur. Seeking außerhalb dieses Fensters ist blockiert; die Waveform zeichnet weiterhin die gesamte Spur.

1. Eine Audiodatei hochladen

Erstelle eine Upload-Session gegen eine Collection, lege dann eine Spur in dieser Session an und sende die Datei-Bytes per PUT an die zurückgegebene Upload-URL. AudioDN akzeptiert gängige Audioformate; eine verlustfreie Quelle (WAV, FLAC oder AIFF) ist am besten, damit Preview-Clip und Streaming-Transcodes aus dem Original höchster Qualität abgeleitet werden. Die Beispiele unten nutzen konkret eine WAV-Datei.

Upload-Session erstellen

Beispielanfrage

# COLLECTION_ID: uuid of the collection to upload into
curl -X POST "https://api.audiodelivery.net/v1/upload_session" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "collection_id": "COLLECTION_ID",
  "expires_in": 7200
}'

// COLLECTION_ID: uuid of the collection to upload into

const payload = {
  "collection_id": "COLLECTION_ID",
  "expires_in": 7200
};

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(payload)
});

const data = await response.json();

# COLLECTION_ID: uuid of the collection to upload into

import requests

headers = {
    "Authorization": "Bearer YOUR_API_KEY",
    "Content-Type": "application/json",
}

payload = {
    "collection_id": "COLLECTION_ID",
    "expires_in": 7200
}

response = requests.post(
    "https://api.audiodelivery.net/v1/upload_session",
    headers=headers,
    json=payload,
)
data = response.json()

Spur in der Session erstellen

Kein Bearer-Header — die upload_session_id im Pfad autorisiert den Aufruf.

Beispielanfrage

# SESSION_ID: upload_session_id returned by the previous call
curl -X POST "https://api.audiodelivery.net/v1/upload/SESSION_ID/track" \
  -H "Content-Type: application/json" \
  -d '{
  "file_name": "track.wav"
}'

// SESSION_ID: upload_session_id returned by the previous call

const payload = {
  "file_name": "track.wav"
};

const response = await fetch('https://api.audiodelivery.net/v1/upload/SESSION_ID/track', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify(payload)
});

const data = await response.json();

# SESSION_ID: upload_session_id returned by the previous call

import requests

headers = {
    "Content-Type": "application/json",
}

payload = {
    "file_name": "track.wav"
}

response = requests.post(
    "https://api.audiodelivery.net/v1/upload/SESSION_ID/track",
    headers=headers,
    json=payload,
)
data = response.json()

Datei-Bytes hochladen

PUT track_upload.upload_url

# Nachdem create-track track_upload.upload_url zurückgibt, PUT der Datei-Bytes:
# Dieses Beispiel nutzt ein WAV — jedes unterstützte Audio funktioniert; verlustfrei (WAV/FLAC/AIFF) ist am besten.
curl -X PUT "$UPLOAD_URL" \
  --data-binary @track.wav \
  -H "Content-Type: audio/wav"

Polle GET /v1/track/:track_id, bis track_status_id ready ist (organisationsweite Varianten, einschließlich Waveforms, werden in diesem Schritt fertig). Siehe die Upload Sessions API für den vollständigen Lifecycle.

2. Eine Preview-Variante hinzufügen

Konfiguriere eine Preview-Variante einmal im Dashboard, damit sie für jeden Upload gilt, oder hänge eine an eine fertige Spur mit der Variants API an. Die Clip-Länge wird in Sekunden oder Prozent gemessen; der Startpunkt ist immer ein Prozentanteil der Gesamtdauer.

Beispielanfrage

# TRACK_ID: uuid of the ready track
curl -X POST "https://api.audiodelivery.net/v1/track/TRACK_ID/variant" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "variant_type_id": "preview",
  "index": "preview",
  "codec": "aac",
  "bitrate": 96,
  "is_stereo": true,
  "is_strip_tags": true,
  "is_strip_cover": true,
  "preview_type": "seconds",
  "preview_seconds": 90,
  "preview_percent": 25,
  "preview_min_percent": 0,
  "preview_max_percent": 60,
  "preview_min_seconds": 0,
  "preview_max_seconds": 90,
  "preview_start_percent": 25
}'

// TRACK_ID: uuid of the ready track

const payload = {
  "variant_type_id": "preview",
  "index": "preview",
  "codec": "aac",
  "bitrate": 96,
  "is_stereo": true,
  "is_strip_tags": true,
  "is_strip_cover": true,
  "preview_type": "seconds",
  "preview_seconds": 90,
  "preview_percent": 25,
  "preview_min_percent": 0,
  "preview_max_percent": 60,
  "preview_min_seconds": 0,
  "preview_max_seconds": 90,
  "preview_start_percent": 25
};

const response = await fetch('https://api.audiodelivery.net/v1/track/TRACK_ID/variant', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_KEY',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify(payload)
});

const data = await response.json();

# TRACK_ID: uuid of the ready track

import requests

headers = {
    "Authorization": "Bearer YOUR_API_KEY",
    "Content-Type": "application/json",
}

payload = {
    "variant_type_id": "preview",
    "index": "preview",
    "codec": "aac",
    "bitrate": 96,
    "is_stereo": True,
    "is_strip_tags": True,
    "is_strip_cover": True,
    "preview_type": "seconds",
    "preview_seconds": 90,
    "preview_percent": 25,
    "preview_min_percent": 0,
    "preview_max_percent": 60,
    "preview_min_seconds": 0,
    "preview_max_seconds": 90,
    "preview_start_percent": 25
}

response = requests.post(
    "https://api.audiodelivery.net/v1/track/TRACK_ID/variant",
    headers=headers,
    json=payload,
)
data = response.json()

Das Beispiel oben fordert einen AAC-96-kbps-Stereo-Clip an: bis zu 90 Sekunden (zusätzlich auf 60 % der Dauer begrenzt), Start bei 25 % der Spur, Tags und Cover-Art entfernt. Bei dieser Demo-Spur (~2:38) wird das Ziel von 90 Sekunden preview_seconds nicht erreicht — preview_max_percent (60 %) greift zuerst und verkürzt den Clip. Die Spur geht kurz in processing und kehrt zu ready zurück, wenn der Clip fertig ist. Vollständige Parameterreferenz: Variants API.

3. Den Player mit der Preview-Variante einbetten

Richte <audiodn-player> auf die Spur und fordere nur die preview-Variante an. Nutze einen Client-Side-Player-API-Schlüssel (sicher im Browser). Der Player lädt Waveform-Levels der gesamten Spur und beschränkt die Wiedergabe auf den Clip.

Abhängigkeit

npm install @audiodn/components

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

Verwendung

<script type="module">
import '@audiodn/components/player';
</script>

<audiodn-player
api-key="YOUR_PLAYER_API_KEY"
scope="track"
id="TRACK_ID"
variants="preview"
size="regular"
></audiodn-player>

Live-Demo

Spiele das Sample unten ab — die Waveform spannt die gesamte Spur, aber nur das Preview-Fenster ist seekbar und abspielbar.

Musik von Nyktrn

Brauchst du Cover-Art, Playlists, Themes oder Größen? Siehe die Player component docs.

Checkliste

Audiodatei (hier WAV; verlustfrei ist am besten) wird hochgeladen und erreicht ready.
Eine preview-Variante existiert auf der Spur (Dashboard-Rezept oder POST /v1/track/:id/variant).
Der Player ist auf die Spur gescoped mit variants=“preview” und einem Client-Side-Player-Schlüssel.
Die Waveform zeigt die gesamte Spur; Seeking außerhalb des Clip-Fensters ist blockiert.