Nguyên mẫu tham chiếu

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

  • Đêm Trăng

    h3R3 · 3:24

    1.204
  • Cà Phê Sáng

    Lofi Cà Phê · 2:48

    986
  • Neon Nights

    Neon Dreams · 3:51

    1.532
  • Gió Mùa Về

    Mây Trắng · 4:12

    743
  • Sunrise Run

    Sunrise Beats · 2:33

    1.870
  • Phố Về Khuya

    Đêm Sài Gòn · 3:40

    512
  • Bay Lên

    h3R3 · 3:05

    621

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 ETagCache-Control để tiết kiệm hạn mức request của API key.