Music Picker demo
Đây là mẫu giao diện “Thêm nhạc vào video” chạy hoàn toàn bằng dữ liệu thật từ REST API XuniBOX. Đối tác có thể xem cách sắp xếp danh sách, tìm kiếm, lọc thể loại và nghe thử, kèm request API tương ứng cho từng thao tác.
Ứng dụng video của đối tác Demo
Chọn nhạc
Con tim dại khờ
Bảo Anh, Bùi Anh Tuấn · 4:17
24Ta đã từng yêu
Lệ Quyên · 4:29
21Cơm áo gạo tiền
Tuấn Phong, Tiến Nguyễn · 3:16
14Trạng thái mộng mơ
Đỗ Hoàng Long · 4:55
9Tìm Em
Bảo Anh, Hngle · 4:35
9Váy cưới
ERIK, Kai Đinh · 3:44
4SSD
W/N, 267, Par SG, Nguyenn · 7:00
3Nơi này có anh
Sơn Tùng M-TP · 4:20
2
Chọn một bài để gắn vào video demo.
Request đang chạy
Mỗi thao tác trong màn hình bên trái tương ứng với một lệnh gọi API công khai.
GET https://xunibox.vn/api/public/tracks?sort=popular&limit=12&page=1
X-API-Key: <api_key_cua_ban>Endpoint dùng trong màn hình này
- GET /tracks?sort=popular — tab “Phổ biến”.
- GET /tracks?q=… — ô tìm kiếm theo tên bài hoặc nghệ sĩ.
- GET /genres — danh sách tab thể loại.
- GET /tracks/{id} — lấy link nghe thử khi người dùng bấm play.
Lưu ý khi tích hợp
- Link audio trả về là đoạn preview đã được cắt sẵn và có hạn sử dụng — gọi lại API để lấy link mới, không lưu link cứng.
- Mỗi bài đã có sẵn title, artist, cover_url, duration, play_count để dựng danh sách như trên.
- Tôn trọng ETag và Cache-Control để tiết kiệm hạn mức request của API key.