Recommended architecture
Web Components
Why it fits
Add uploading and playback with maintained web components and scoped client-side credentials. No application backend is required.
Upload approach
The AudioDN uploader component sends files directly, authorized by a scoped Client-Side Upload key.
Playback approach
The AudioDN player component uses a scoped Client-Side Player key and renews playback sessions automatically.
Credential or session model
- Client-Side Upload key
- Client-Side Player key
AudioDN handles
- Upload interface
- Player interface
- Session creation
- Direct audio upload
- Playback delivery
- Variant selection
Your team handles
- Page layout
- Product content
- Collection configuration
- Choosing which audio is displayed
Conceptual flow
- User
- AudioDN component
- Scoped Client-Side key
- AudioDN upload or playback session
See the basic flow
<script type="module">
import '@audiodn/components/uploader'
import '@audiodn/components/player'
</script>
<audiodn-uploader
api-key="CLIENT_SIDE_UPLOAD_KEY"
collection-id="COLLECTION_ID"
></audiodn-uploader>
<audiodn-player
api-key="CLIENT_SIDE_PLAYER_KEY"
scope="collection"
id="COLLECTION_ID"
></audiodn-player>