All Products
Search
Document Center

ApsaraVideo VOD:Referensi API Aliplayer

Last Updated:Mar 20, 2026

Topik ini menjelaskan properti, metode, dan event yang didukung oleh Aliplayer.

Catatan

Jika Anda mengalami masalah saat menggunakan Aliplayer, lihat FAQ Web Player atau Troubleshooting Mandiri untuk Error Pemutaran.

Properti

Saat melakukan inisialisasi Aliplayer, Anda dapat mengatur berbagai properti, termasuk otorisasi lisensi, informasi sumber media, pengaturan UI player, dan perilaku pemutaran.

Name

Type

Description

id

String

ID elemen DOM dari kontainer luar player.

source

String

Saat menggunakan pemutaran berbasis URL, tentukan URL video dengan properti ini.

Catatan
  • Pemutaran berbasis URL memiliki prioritas tertinggi. Ini menggantikan metode pemutaran lain seperti VidAuth dan VidSts. Jika Anda mengatur source, player akan menggunakan URL tersebut meskipun Anda juga mengonfigurasi VidAuth atau VidSts. Gunakan hanya satu metode pemutaran.

  • Pemutaran berbasis URL mendukung multi-definisi. Tentukan URL untuk setiap definisi menggunakan properti ini. Untuk informasi lebih lanjut, lihat Pemutaran Multi-definisi. Contoh:

    source: '{"HD":"address1","SD":"address2"}'

vid

String

ID media untuk layanan ApsaraVideo Media Processing.

playauth

String

Kredensial pemutaran. Untuk petunjuk cara memperoleh kredensial pemutaran, lihat Memperoleh Kredensial Pemutaran.

customVodServer

String

Domain kustom untuk proxy VOD (didukung dalam mode pemutaran VidAuth versi 2.32.0 dan yang lebih baru). Anda harus men-deploy layanan proxy permintaan khusus. Saat domain VOD default (*.aliyuncs.com) tidak dapat dijangkau, player secara otomatis beralih ke layanan proxy Anda. Hal ini menghindari pembajakan ISP dan meningkatkan stabilitas serta tingkat keberhasilan pemutaran.

playConfig

JSON

Pengaturan kustom yang digunakan saat memutar dengan Vid (VidAuth atau VidSts). Nilai-nilai ini diteruskan ke API VOD. Untuk bidang dan deskripsi parameter yang didukung, lihat Pengaturan PlayConfig Kustom untuk Pemutaran Media. Contoh nilai:

{"PlayDomain":"vod.test_domain","PreviewTime":"20","MtsHlsUriToken":"yqCD7******oVjslp5Q"}

authTimeout

Number

Periode validitas URL pemutaran video yang diperoleh menggunakan Vid (VidAuth atau VidSts). Satuan: detik. Default: 7200.

Pastikan nilai ini melebihi durasi video aktual untuk mencegah URL pemutaran kedaluwarsa sebelum pemutaran selesai.

height

String

Tinggi player. Nilai yang valid:

  • 100%

  • 100px

width

String

Lebar player. Nilai yang valid:

  • 100%

  • 100px

autoSize

Boolean | String

Secara otomatis menyesuaikan ukuran player agar sesuai dengan konten video. Nilai yang valid: 'height' atau 'width'.

Misalnya, atur width: '500px' dan autoSize: 'height'. Player mempertahankan lebar tetap 500px dan menyesuaikan tingginya berdasarkan rasio aspek video.

Atau atur height: '500px' dan autoSize: 'width'. Player mempertahankan tinggi tetap 500px dan menyesuaikan lebarnya berdasarkan rasio aspek video.

Catatan: autoSize: true sama dengan autoSize: 'height'. Penyesuaian ukuran tinggi adalah default.

videoWidth

String

Lebar video. Untuk informasi lebih lanjut, lihat Mengatur Mode Tampilan.

videoHeight

String

Tinggi video. Untuk informasi lebih lanjut, lihat Mengatur Mode Tampilan.

preload

Boolean

Player memuat secara otomatis.

cover

String

Gambar sampul default untuk player. Masukkan URL gambar yang valid. Pengaturan ini hanya berlaku saat autoplay diatur ke false.

isLive

Boolean

Menunjukkan apakah kontennya adalah streaming langsung. Saat diaktifkan, pengguna tidak dapat menyeret bilah kemajuan. Default: false. Atur ke true untuk streaming langsung.

autoplay

Boolean

Aktifkan autoplay untuk player. Autoplay gagal pada perangkat seluler. Nilai yang valid:

  • true (default): Aktifkan autoplay.

  • false: Nonaktifkan autoplay.

Catatan

Karena pembatasan browser, autoplay mungkin gagal di Web Player SDK. Untuk detailnya, lihat Fitur Lanjutan.

autoplayPolicy

Object

Player mendukung kebijakan adaptif untuk autoplay senyap. Properti ini hanya berlaku saat autoplay diatur ke true. Contoh konfigurasi sebagai berikut:

autoplayPolicy: {
  fallbackToMute: true, // Beralih ke autoplay senyap jika autoplay bersuara gagal. Default: false.
  showUnmuteBtn: true, // Tampilkan tombol unmute besar saat autoplay senyap aktif. Default: true.
}
Catatan
  • Autoplay senyap yang berhasil memicu event mutedAutoplay.

  • Saat player mengaktifkan autoplay (parameter autoplay diatur ke true) dan autoplay senyap adaptif (parameter autoplayPolicy.fallbackToMute diatur ke true), player pertama-tama mencoba autoplay bersuara. Jika upaya ini gagal, player beralih ke autoplay senyap. Perlu diperhatikan bahwa autoplay senyap tidak dijamin berhasil.

rePlay

Boolean

Aktifkan putar ulang berulang otomatis.

useH5Prism

Boolean

Gunakan player HTML5.

playsinline

Boolean

Aktifkan pemutaran inline untuk HTML5. Beberapa browser Android tidak mendukung fitur ini.

skinRes

Url

URL gambar skin. Kami tidak merekomendasikan mengubah bidang ini. Untuk menyesuaikan skin, lihat Menyesuaikan Skin Player.

skinLayout

Array | Boolean

Konfigurasikan tata letak komponen UI. Abaikan properti ini untuk menggunakan tata letak default. Atur ke false untuk menyembunyikan semua komponen UI. Untuk informasi lebih lanjut, lihat Mengonfigurasi Properti skinLayout.

skinLayoutIgnore

Array

Daftar komponen UI yang akan disembunyikan. Lihat Referensi Parameter Komponen VOD untuk nama komponen. Contoh konfigurasi:

skinLayoutIgnore: [
  'bigPlayButton', // Sembunyikan tombol play besar.
  'controlBar.fullScreenButton' // Sembunyikan tombol full-screen di bilah kontrol (gunakan notasi titik untuk komponen bersarang).
]
Catatan

skinLayoutIgnore memiliki prioritas lebih tinggi daripada skinLayout.

controlBarVisibility

String

Implementasi panel kontrol. Nilai yang valid meliputi:

  • click: Anda dapat mengklik area player.

  • hover (default): Tampilkan saat pengguna mengarahkan kursor ke area player.

  • always: Selalu tampilkan bilah kontrol.

  • Never: Sembunyikan seluruh panel kontrol.

showBarTime

Number

Waktu dalam milidetik sebelum bilah kontrol disembunyikan secara otomatis.

enableSystemMenu

Boolean

Aktifkan menu klik kanan sistem. Default: false.

format

String

Tentukan format URL pemutaran. Nilai yang valid:

  • mp4

  • hls atau m3u8

  • flv

  • mp3

Default: kosong.

mediaType

String

Tentukan apakah akan mengembalikan audio atau video. Hanya didukung saat menggunakan pemutaran berbasis vid. Default: video. Nilai yang valid:

  • video: Video.

  • audio: Format audio saja, seperti file MP4 yang hanya berisi audio.

qualitySort

String

Tentukan urutan pengurutan. Hanya didukung saat menggunakan pemutaran Vid + PlayAuth. Nilai yang valid:

  • desc: Urutkan secara menurun (dari terbesar ke terkecil).

  • asc: Urutkan secara menaik (dari terkecil ke terbesar).

Default: asc.

definition

String

Tentukan definisi video mana yang akan ditampilkan. Pisahkan beberapa definisi dengan koma (,). Contoh: 'FD,LD'. Ini adalah subset dari definisi yang tersedia untuk vid yang ditentukan. Nilai yang valid:

  • FD (definisi rendah)

  • LD (definisi standar)

  • HD (definisi tinggi)

  • HD (resolusi ultra-tinggi)

  • OD (kualitas asli)

  • 2K (2K)

  • 4K (4K)

defaultDefinition

String

Atur definisi video default. Ini harus merupakan salah satu definisi yang tersedia untuk vid yang ditentukan. Nilai yang valid:

  • FD (definisi rendah)

  • LD (definisi standar)

  • SD (Definisi Standar)

  • HD (resolusi ultra-tinggi)

  • OD (kualitas asli)

  • 2K (2K)

  • 4K (4K)

autoPlayDelay

Number

Penundaan sebelum pemutaran dimulai. Satuan: detik.

language

String

Atur bahasa untuk internasionalisasi. Default: zh-cn. Jika diabaikan, bahasa browser akan digunakan. Nilai yang valid:

  • zh-cn: Bahasa Tiongkok

  • en-us: Bahasa Inggris

languageTexts

JSON

Teks internasionalisasi kustom dalam format JSON. Kunci harus sesuai dengan nilai properti language. Contoh: {jp:{Play:"Play"}}. Untuk daftar lengkap kunci, lihat Struktur JSON.

snapshotWatermark

Object

Konfigurasikan watermark tangkapan layar untuk player HTML5.

useHlsPluginForSafari

Boolean

Aktifkan plugin HLS untuk browser Safari, kecuali Safari 11. Nilai yang valid:

  • true: Aktifkan.

  • false (default): Nonaktifkan.

enableStashBufferForFlv

Boolean

Aktifkan caching pemutaran untuk FLV di player HTML5. Hanya berlaku untuk streaming langsung. Nilai yang valid:

  • true (default): Aktifkan.

  • false: Nonaktifkan.

stashInitialSizeForFlv

Number

Ukuran cache awal untuk FLV di player HTML5. Hanya berlaku untuk streaming langsung. Default: 32 KB.

Nilai yang lebih kecil meningkatkan kecepatan startup. Namun, jika terlalu kecil, pemutaran mungkin tersendat setelah waktu singkat.

loadDataTimeout

Number

Waktu dalam detik sebelum meminta pengguna untuk beralih ke definisi yang lebih rendah karena buffering. Default: 20.

waitingTimeout

Number

Timeout buffering maksimum. Pesan error muncul jika waktu ini terlampaui. Satuan: detik. Default: 60.

diagnosisButtonVisible

Boolean

Tampilkan tombol diagnosis. Nilai yang valid:

  • true (default): Tampilkan tombol.

  • false: Sembunyikan tombol.

disableSeek

Boolean

Nonaktifkan pencarian dengan bilah kemajuan. Nilai yang valid:

  • true: Nonaktifkan.

  • false (default): Tidak menonaktifkan.

encryptType

Number

Aktifkan enkripsi video Alibaba Cloud (enkripsi privat). Default: 0. Nilai yang valid:

  • 0: Putar video tanpa enkripsi.

  • 1: Putar video yang dienkripsi secara privat.

Catatan

progressMarkers

Array

Array objek penanda kemajuan. Untuk informasi lebih lanjut, lihat Penanda Bilah Kemajuan.

vodRetry

Number

Jumlah percobaan ulang untuk kegagalan pemutaran VOD. Default: 3.

liveRetry

Number

Jumlah percobaan ulang untuk kegagalan pemutaran streaming langsung. Default: 5.

hlsFrameChasing

Boolean

Aktifkan pengejaran frame untuk streaming langsung HLS. Nilai yang valid:

  • true: Aktifkan pengejaran frame.

  • false (default): Nonaktifkan pengejaran frame.

Catatan

Hanya Web Player SDK versi sebelum 2.21.0 yang mendukung pengaturan parameter ini. Untuk versi 2.21.0 dan yang lebih baru, untuk mengaktifkan sinkronisasi frame dalam mode streaming langsung HLS, lihat properti hlsOption.maxLiveSyncPlaybackRate.

chasingFirstParagraph

Number

Durasi segmen pengejaran frame pertama. Satuan: detik. Default: 20.

Catatan

Anda hanya dapat mengatur parameter ini di Web Player SDK versi sebelum 2.21.0. Untuk versi 2.21.0 dan yang lebih baru, untuk mengatur sinkronisasi frame dalam mode streaming langsung HLS, lihat properti hlsOption.maxLiveSyncPlaybackRate.

chasingSecondParagraph

Number

Durasi segmen pengejaran frame kedua. Satuan: detik. Default: 40.

Catatan

Hanya Web Player SDK versi sebelum 2.21.0 yang mendukung pengaturan parameter ini. Untuk versi 2.21.0 dan yang lebih baru, untuk mengatur sinkronisasi frame dalam mode streaming langsung HLS, lihat properti hlsOption.maxLiveSyncPlaybackRate.

chasingFirstSpeed

Number

Kecepatan pemutaran untuk segmen pengejaran frame pertama. Default: 1.1×.

Catatan

Hanya Web Player SDK versi sebelum 2.21.0 yang mendukung konfigurasi parameter ini. Untuk versi 2.21.0 dan yang lebih baru, untuk mengonfigurasi sinkronisasi frame dalam mode streaming langsung HLS, lihat properti hlsOption.maxLiveSyncPlaybackRate.

chasingSecondSpeed

Number

Kecepatan pemutaran untuk segmen pengejaran frame kedua. Default: 1.2×.

Catatan

Hanya Web Player SDK versi di bawah 2.21.0 yang mendukung pengaturan parameter ini. Untuk versi 2.21.0 dan yang lebih baru, untuk mengonfigurasi sinkronisasi frame dalam mode streaming langsung HLS, lihat properti hlsOption.maxLiveSyncPlaybackRate.

hlsOption.maxLiveSyncPlaybackRate

Number

Atur kecepatan pemutaran untuk pengejaran frame dalam streaming langsung HLS. Default: 1 (tanpa pengejaran frame).

  • Contoh konfigurasi:

    hlsOption: {
      maxLiveSyncPlaybackRate: 1.5, // Atur kecepatan pemutaran pengejaran frame.
      liveSyncDurationCount: 3 // Atur jumlah segmen yang memicu pengejaran frame.
    }
  • Makna contoh: Saat latensi streaming langsung melebihi durasi 3 segmen, player memutar dengan kecepatan 1.5× untuk mengejar ketinggalan hingga 3 segmen (karena player memerlukan buffer untuk menangani fluktuasi jaringan, Anda harus memodifikasi nilai liveSyncDurationCount dengan hati-hati — mengatur nilai ini terlalu rendah dapat menyebabkan tersendat).

Catatan

Parameter ini hanya didukung di Web Player SDK versi 2.21.0 dan yang lebih baru.

flvFrameChasing

Boolean

Aktifkan pengejaran frame untuk streaming langsung FLV. Nilai yang valid:

  • true: Aktifkan pengejaran frame.

  • false: Nonaktifkan pengejaran frame.

Default: false.

keyShortCuts

Boolean

Aktifkan pintasan keyboard. Nilai yang valid:

  • true: Aktifkan pintasan keyboard.

  • false: Nonaktifkan pintasan keyboard.

Default: false.

Catatan

Tombol panah (kiri/kanan) mengontrol maju cepat dan mundur cepat. Tombol panah (atas/bawah) mengontrol volume. Spasi mengaktifkan/menonaktifkan putar/jeda.

keyFastForwardStep

Number

Interval waktu untuk maju cepat dan mundur cepat. Satuan: detik. Default: 10.

rtsFallback

Boolean

Saat browser tidak mendukung RTS atau penarikan aliran RTS gagal, player secara otomatis beralih ke FLV atau HLS. Player lebih memilih FLV untuk latensi yang lebih rendah. Jika browser tidak mendukung FLV, player beralih ke HLS.

Fitur ini diaktifkan secara default. Untuk menonaktifkannya, atur parameter ini ke false.

rtsFallbackType

String

Tentukan protokol yang akan dialihkan dari RTS. Nilai yang valid: HLS atau FLV. Secara default, player memilih secara otomatis, lebih memilih FLV untuk latensi yang lebih rendah. Jika browser tidak mendukung FLV, player beralih ke HLS.

rtsFallbackSource

String

Kami merekomendasikan menggunakan strategi fallback default player. Namun, jika Anda ingin menentukan URL aliran tetap untuk fallback, gunakan parameter ini.

traceId

String

Identifier pengguna unik Anda. Teruskan nilai ini ke titik instrumentasi publik untuk melacak pelaporan log. Secara default, Web Player SDK mengaktifkan pelaporan log. Meneruskan traceId membantu mengidentifikasi pengguna. Jika diabaikan, Web Player SDK menghasilkan dan menyimpan UUID di cache browser.

Catatan

Didukung di Web Player SDK versi 2.10.0 dan yang lebih baru.

textTracks

Array

Konfigurasikan teks terjemahan WebVTT eksternal. Contoh:

textTracks: [
  { kind: 'subtitles', label: 'Chinese', src: 'caption-url', srclang: 'zh-CN', default: true },
  { kind: 'subtitles', label: 'English (US)', src: 'caption-url', srclang: 'en-US' }
],

Deskripsi bidang:

  • Jenis: jenis caption. Nilai yang valid: subtitles atau captions.

  • label: Nama yang ditampilkan sebagai keterangan dalam antarmuka pengguna.

  • srclang: Bahasa teks terjemahan.

  • src: URL Caption. Akses lintas asal (cross-origin) harus diizinkan.

  • default: Atur ke true untuk menampilkan teks terjemahan ini secara default. Didukung di Web Player SDK versi 2.15.7 dan yang lebih baru.

Catatan
  • Didukung di Web Player SDK versi 2.12.0 dan yang lebih baru.

  • Teks terjemahan WebVTT eksternal tidak didukung di browser berikut:

    • Internet Explorer

    • Browser QQ untuk Android, browser sistem OPPO/OnePlus

    • Browser lain yang membajak tag video

  • Untuk deskripsi mendetail mengenai atribut takarir, lihat spesifikasi HTML.

  • Untuk pengaturan keterangan lanjutan, lihat Keterangan Eksternal.

ratio

Number

Atur player untuk diskalakan pada rasio aspek tetap. Misalnya, diberikan rasio aspek video 16:9, atur parameter player ke width: "100%", ratio: 16/9. Ini menjaga rasio aspek player konsisten dengan konten video dan memungkinkannya diskalakan secara proporsional saat halaman diskalakan.

extLanguageTexts

Object

Web Player SDK menyertakan teks UI bawaan dalam bahasa Tiongkok dan Inggris. Gunakan properti ini untuk menyesuaikan teks untuk elemen UI tertentu. Misalnya, untuk mengubah tampilan HD dari definisi tinggi menjadi 1080p:

extLanguageTexts: {
    'zh-cn': {
      'HD': '1080p'
    }
}

speedLevels

Array

Menyesuaikan daftar kecepatan pemutaran. Setiap objek berisi kunci (nilai kecepatan) dan teks (label UI). Jika diabaikan, daftar default akan digunakan. Contoh:

speedLevels: [
  {"key": 0.25, "text": "0.25"},
  {"key": 0.5, "text": "0.5"},
  {"key": 1, "text": "Normal"},
  {"key": 1.25, "text": "1.25"},
  {"key": 1.5, "text": "1.5"},
  {"key": 2,"text": "2"}
]

logo

Array

Konfigurasikan gambar logo kustom. Contoh:

    logo: [{
      width: 30,
      position: 'bottom-right',
      origin: 'content',
      src: 'a.png'
    },
    {
      width: 20,
      position: 'bottom-right',
      offsetY: -20,
      origin: 'content',
      src: 'b.png'
    }]

Deskripsi bidang:

  • src: URL gambar logo.

  • origin: Titik referensi untuk posisi. Nilai yang valid:

    • box: Kontainer player

    • content: Konten video

  • width/height: Dimensi logo sebagai persentase (dihitung relatif terhadap origin). Jika hanya satu dimensi yang ditentukan, dimensi lainnya diskalakan secara proporsional.

  • position: Posisi relatif dalam origin. Nilai yang valid:

    • top-left: Sudut kiri atas

    • top-right: Sudut kanan atas

    • bottom-left: Sudut kiri bawah

    • bottom-right: Sudut kanan bawah

  • offsetX/offsetY: Offset dari posisi, sebagai persentase (dihitung relatif terhadap origin).

license

Object

Untuk menggunakan fitur bernilai tambah seperti Pemantauan Kualitas Pemutaran (Lama), Troubleshooting Titik Tunggal, atau Pemutaran Video H.265/H.266, pertama-tama kirimkan Formulir Permohonan Layanan Bernilai Tambah Web Player SDK untuk memperoleh lisensi. Kemudian integrasikan lisensi sebagai berikut:

// domain adalah domain yang Anda masukkan saat mengajukan lisensi.
// key adalah kunci lisensi.
license: {
    domain: "example.com",
    key: "example-key"
  }

mute

Boolean

Aktifkan pemutaran senyap. Konfigurasikan parameter ini untuk mengaktifkan autoplay senyap saat browser memblokir autoplay. Untuk detailnya, lihat Fitur Lanjutan.

clickPause

Boolean

Klik area video untuk menjeda atau melanjutkan pemutaran.

  • true: Aktifkan.

  • false: Nonaktifkan.

Default: true di desktop, false di seluler. Jangan gunakan bersama dbClickSkip untuk menghindari konflik interaksi.

disablePip

Boolean

Sembunyikan tombol Picture-in-Picture (PiP) asli browser.

Catatan
  • Didukung di Web Player SDK versi 2.20.0 dan yang lebih baru.

  • Didukung di Firefox versi 116 dan yang lebih baru.

env

String

Secara default, data telemetri player diunggah ke pusat data Tiongkok. Jika Anda memiliki persyaratan kepatuhan untuk data di luar Tiongkok, atur env: 'SEA' untuk mengunggah data ke pusat data Singapura.

watchStartTime

Number

Gunakan sendiri untuk mengatur waktu mulai pemutaran.

Gunakan bersama watchEndTime untuk mengaktifkan pemutaran rentang waktu. Pengguna hanya dapat memutar dan mencari dalam rentang waktu yang ditentukan.

Satuan: detik

watchEndTime

Number

Gunakan bersama watchStartTime untuk mengaktifkan pemutaran rentang waktu. Pengguna hanya dapat memutar dan mencari dalam rentang waktu yang ditentukan.

Jika nilai ini kurang dari watchStartTime, watchStartTime diabaikan.

Satuan: detik

start

Number

Gunakan bersama end untuk mengekstrak segmen dari video. Misalnya, jika video asli berdurasi 60 detik dan Anda mengatur start: 10 dan end: 30, player menampilkan video 20 detik yang dimulai dari detik ke-10 video asli.

end

Number

Gunakan bersama start untuk mengekstrak segmen dari video. Misalnya, jika video asli berdurasi 60 detik dan Anda mengatur start: 10 dan end: 30, player menampilkan video 20 detik yang dimulai dari detik ke-10 video asli.

dbClickFullscreen

Boolean

Aktifkan klik ganda untuk masuk layar penuh. Diaktifkan secara default di desktop.

longPressFastForward

Boolean

Aktifkan maju cepat tekan lama (hanya seluler). Nilai yang valid:

  • true (default): Aktifkan.

  • false: Nonaktifkan.

dbClickSkip

Boolean

Klik ganda sisi kiri untuk mundur cepat, klik ganda sisi kanan untuk maju cepat (hanya seluler). Nilai yang valid:

  • true (default): Aktifkan.

  • false: Nonaktifkan.

Jangan gunakan bersama clickPause untuk menghindari konflik interaksi.

enableMockFullscreen

Boolean

Aktifkan fullscreen semu berbasis CSS. Secara default, player memanggil API fullscreen browser. Di iOS dan beberapa browser Android, player sistem mengambil alih layar penuh, menyebabkan masalah UI. Aktifkan parameter ini untuk menghindari pengambilalihan. Default: false.

watermark

Object

Konfigurasikan watermark dinamis. Contoh:

watermark: {
  enable: true,
  text: 'Copyright ©2026',
  mode: 'BULLET'
}

Deskripsi bidang:

  • enable: Aktifkan watermark dinamis.

  • text: Teks yang ditampilkan sebagai watermark.

  • mode: Mode watermark. Nilai yang valid:

    • BULLET: Marquee (default).

    • GHOST: Kedip acak.

  • direction: Arah gerakan. Nilai yang valid:

    • RTL: Kanan ke kiri (default).

    • LTR: Kiri ke kanan.

    • STATIC: Stasioner (hanya berlaku untuk mode GHOST).

  • speed: Kecepatan gerakan. Rentang: 0~100. Nilai yang lebih tinggi berarti gerakan lebih cepat. Default: 50 untuk BULLET, 30 untuk GHOST.

  • interval: Waktu dalam milidetik antara menghilang dan muncul kembali watermark. Default: 3000.

  • duration: Durasi tampilan untuk setiap kemunculan watermark (hanya mode GHOST). Default: 5000 (milidetik).

  • opacity: Transparansi teks watermark. Rentang: 0~1. Default: 0.5.

  • fontSize: Ukuran font teks watermark. Nilai font-size CSS. Default: 14px.

  • fontColor: Warna teks watermark. Nilai warna CSS yang valid. Default: #FFFFFF.

  • top: Jarak dari atas kontainer ke area watermark. Mendukung nilai piksel (misalnya, 50) atau persentase (misalnya, '20%').

  • bottom: Jarak dari bawah kontainer ke area watermark. Mendukung nilai piksel atau persentase.

  • left: Jarak dari kiri kontainer ke area watermark. Mendukung nilai piksel atau persentase (hanya mode GHOST).

  • right: Jarak dari kanan kontainer ke area watermark. Mendukung nilai piksel atau persentase (hanya mode GHOST).

memoryPlay

Object

Untuk mengaktifkan melanjutkan pemutaran, tambahkan opsi memoryPlay ke konfigurasi player. Contoh:

// Konfigurasi melanjutkan pemutaran
memoryPlay: {
    enable: true, // Aktifkan melanjutkan pemutaran.
    autoSeek: false // Secara otomatis lompat ke posisi yang diingat.
}

Deskripsi bidang:

  • enable: Aktifkan melanjutkan pemutaran. Nilai yang valid:

    • false (default): Nonaktifkan melanjutkan pemutaran.

    • true: Aktifkan melanjutkan pemutaran.

  • autoSeek: Secara otomatis lompat ke posisi yang diingat. Nilai yang valid:

    • false (default): Tampilkan prompt yang menanyakan kepada pengguna apakah akan melompat (disarankan).

    • true: Lompat ke posisi yang diingat dan tampilkan prompt setelah video dimuat.

getTimeFunction/saveTimeFunction digunakan untuk skenario yang memerlukan kontrol kemajuan pemutaran kustom (seperti sinkronisasi multi-perangkat). Jika diabaikan, player secara default menyimpan kemajuan di localStorage.

  • getTimeFunction: Ambil waktu yang diingat dari lokasi penyimpanan kustom. Tanda tangan fungsi: (videoKey) => number|Promise<number>.

  • saveTimeFunction: Simpan waktu pemutaran saat ini. Tanda tangan fungsi: (videoKey, currentTime) => void.

menuMode

String

Atur tempat menampilkan kontrol kecepatan pemutaran, definisi, teks terjemahan, dan trek audio. Nilai yang valid:

  • fold (default): Tempatkan di submenu Settings.

  • expand: Tampilkan di bilah kontrol (menu utama).

Metode

Anda dapat memanggil metode-metode berikut setelah event ready terjadi atau dalam callback ready saat membuat player. Contoh:

// Metode 1:
var player = new Aliplayer({}, function (player) {
  player.play();
});

// Metode 2:
var player = new Aliplayer({});
function handleReady(player) {
  player.play();
};
player.on('ready', handleReady);

Metode yang tersedia untuk instans Aliplayer:

play()

Mulai pemutaran.

Definisi Fungsi

() => Player

pause()

Jeda pemutaran.

(showPlayButton?: boolean) => Player

Parameter

Name

Type

Required

Description

showPlayButton

Boolean

No

Tampilkan tombol play.

replay()

Mulai ulang pemutaran.

Definisi Fungsi

() => Player

seek()

Lompat ke waktu tertentu.

Definisi Fungsi

(time: number) => Player 

Parameter

Name

Type

Required

Description

time

number

Yes

Waktu untuk dilompati. Satuan: detik.

dispose()

Hancurkan pemain.

Definisi Fungsi

() => void

getCurrentTime()

Peroleh waktu pemutaran saat ini dalam satuan detik.

Definisi Fungsi

() => number

getDuration()

Peroleh durasi total video dalam satuan detik. Metode ini dapat dipanggil setelah video dimuat atau setelah event play.

Definisi Fungsi

() => number

getVolume()

Peroleh volume saat ini. Mengembalikan bilangan real antara 0 dan 1. Tidak didukung di iOS dan beberapa perangkat Android.

Definisi Fungsi

() => number | undefined

setVolume()

Atur volume.

Definisi Fungsi

(volume: number) => void

Parameter

Name

Type

Required

Description

volume

number

Yes

Volume sebagai bilangan real antara 0 dan 1. Tidak didukung di iOS dan beberapa perangkat Android.

mute()

Matikan suara pemutaran.

Definisi Fungsi

(quiet?: boolean) => Player

Parameter

Name

Type

Required

Description

quiet

boolean

No

Sembunyikan teks status mute/unmute di pojok kiri bawah.

unMute()

Nyalakan kembali suara pemutaran.

Definisi Fungsi

(quiet?: boolean) => Player

Parameter

Name

Type

Required

Description

quiet

boolean

No

Apakah akan menyembunyikan prompt teks di pojok kiri bawah saat Anda menyalakan kembali suara.

getPlayTime()

Peroleh waktu pemutaran aktual (tidak termasuk waktu jeda). Untuk pemutaran dengan kecepatan variabel, metode ini mengembalikan waktu berlalu aktual dalam satuan detik.

Definisi Fungsi

() => number

loadByUrl()

Beralih ke video lain. Hanya mendukung peralihan antara video dengan format yang sama, seperti MP4, HLS, atau FLV. Untuk beralih antar format berbeda, Anda harus menghapus player dan membuat instans baru.

Definisi fungsi

(url: string, seconds?: number, autoPlay?: boolean) => void

Parameter

Name

Type

Required

Description

url

string

Yes

URL video yang akan dialihkan.

seconds

number

No

Waktu mulai pemutaran setelah beralih.

autoPlay

boolean

No

Mulai pemutaran secara otomatis setelah beralih.

replayByVidAndPlayAuth()

Beralih ke video VOD lain. Hanya mendukung peralihan antara video dengan format yang sama.

Definisi Fungsi

(vid: string, playauth: string) => void

Parameter

Name

Type

Required

Description

vid

string

Yes

ID video.

playauth

string

Yes

Kredensial pemutaran.

replayByVidAndAuthInfo()

Beralih ke video MPS lain. Hanya mendukung peralihan antara video dengan format yang sama.

Definisi Fungsi

(vid: string, accId: string, accSecret: string, stsToken: string, authInfo: string, domainRegion: string) => void

Untuk informasi detail parameter, lihat Pemutaran MPS.

replayByMediaAuth()

Beralih ke video Layanan Media Universal lain. Hanya mendukung peralihan antara video dengan format yang sama.

Definisi fungsi

(mediaAuth: string) => void

Parameter

Name

Type

Required

Description

mediaAuth

string

Yes

Kredensial pemutaran.

getBuildInComponent()

Peroleh komponen UI bawaan (seperti tombol layar penuh atau bilah kemajuan).

Definisi Fungsi

(name: string) => BuildInComponent;

Parameter

Name

Type

Required

Description

name

string

Yes

Nama komponen bawaan (misalnya, fullScreenButton). Lihat Mengonfigurasi Properti skinLayout untuk daftar nama komponen. Setiap komponen mendukung metode hide dan show.

setPlayerSize()

Atur ukuran player.

Definisi fungsi

(width: string, height: string) => void

Parameter

Name

Type

Required

Description

width

string

Yes

Atur ukuran player. Nilai yang valid:

  • 400px

  • 60%

height

string

Yes

setSpeed()

Atur kecepatan pemutaran secara manual. Fitur ini mungkin tidak berfungsi di perangkat seluler (seperti WeChat di Android). Kontrol kecepatan diaktifkan secara default.

Definisi Fungsi

(speed: number) => void

Parameter

Name

Parameter type

Required

Description

speed

number

Yes

Mendukung kecepatan pemutaran dari 0.5× hingga 2×.

Catatan

Untuk menonaktifkan kontrol kecepatan:

  • Kontrol kecepatan tidak dapat dinonaktifkan atau disesuaikan secara individual; Anda harus menonaktifkannya secara global.

  • Untuk menonaktifkan kontrol kecepatan melalui penggantian CSS:

    .prism-setting-speed {
       display: none !important;
     }

setTraceId()

Teruskan instrumentasi umum untuk pelacakan log.

Definisi fungsi

(traceId: string) => void

Parameter

Name

Type

Required

Description

traceId

string

Yes

Identifier unik.

Catatan

Didukung di Web Player SDK versi 2.10.0 dan yang lebih baru.

setSanpshotProperties()

Konfigurasikan pengaturan tangkapan layar.

Definisi Fungsi

(width: number, height: number, rate: number) => void

Parameter

Name

Type

Required

Description

width

number

Yes

Unit lebar dan tinggi: piksel. Rentang kualitas tangkapan layar: 0–1 (default: 1). Untuk detail lebih lanjut, lihat Tangkapan Layar Video.

height

number

Yes

rate

number

Yes

fullscreenService.requestFullScreen()

Masuk layar penuh.

Definisi Fungsi

() => Player

fullscreenService.cancelFullScreen()

Keluar layar penuh. Tidak didukung di iOS.

Definisi fungsi

() => Player

fullscreenService.getIsFullScreen()

Peroleh status layar penuh.

Definisi Fungsi

() => boolean

getStatus()

Peroleh status player dalam bentuk string. Nilai yang mungkin dikembalikan:

  • init: Menginisialisasi.

  • ready: Siap.

  • loading: Memuat.

  • play: Memutar.

  • pause: Dijeda.

  • playing: Sedang diputar.

  • waiting: Buffering.

  • error: Error.

  • ended: Selesai.

Definisi Fungsi

() => string

liveShiftSerivce.setLiveTimeRange()

Atur waktu mulai dan akhir untuk streaming langsung guna mengaktifkan pergeseran waktu.

Definisi Fungsi

(start: string, end: string) => void

Parameter

Name

Type

Required

Description

start

string

Yes

Waktu mulai untuk streaming langsung.

end

string

Yes

Waktu akhir untuk streaming langsung.

Contoh

player.liveShiftSerivce.setLiveTimeRange('2025/03/21 12:43:00', '2025/03/21 23:31:00')

setRotate()

Atur sudut rotasi player.

Definisi Fungsi

(rotate: number) => void

Parameter

Name

Type

Required

Description

rotate

number

Yes

Nilai positif memutar searah jarum jam. Nilai negatif memutar berlawanan arah jarum jam. Contoh: setRotate(90). Untuk informasi lebih lanjut, lihat Mengatur Mode Tampilan.

getRotate()

Peroleh sudut rotasi player.

Definisi Fungsi

() => number

Untuk informasi lebih lanjut, lihat Mengatur Mode Tampilan.

setImage()

Terapkan pencerminan.

Definisi Fungsi

(type: string) => void

Parameter

Name

Type

Required

Description

type

string

Yes

Nilai yang valid:

  • horizon: Balik horizontal.

  • Vertical: Mengacu pada orientasi vertikal.

Contoh: setImage('horizon'). Untuk informasi lebih lanjut, lihat Mengatur Mode Tampilan.

setCover()

Atur gambar sampul.

Definisi Fungsi

(coverUrl: string) => void

Parameter

Name

Type

Required

Description

coverUrl

string

Yes

URL thumbnail.

setProgressMarkers()

Atur penanda kemajuan.

Definisi fungsi

(markers: Array<{ time: number, text: string }>) => void

Parameter

Name

Type

Required

Description

markers

Array<markers>

Yes

markers: Array objek penanda (wajib).

marker.time: Waktu penanda (wajib).

marker.text: Label teks untuk penanda (wajib).

Lihat parameter progressMarkers untuk detailnya.

setPreviewTime()

Atur durasi pratinjau.

Definisi Fungsi

(time: number) => void

Parameter

Name

Type

Required

Description

time

number

Yes

Satuan: detik. Untuk informasi lebih lanjut, lihat Pratinjau.

getPreviewTime()

Peroleh durasi pratinjau.

Definisi fungsi

() => number

isPreview()

Periksa apakah mode pratinjau aktif.

Definisi Fungsi

() => boolean

getCurrentPDT()

Peroleh ProgramDateTime saat ini untuk aliran video HLS.

Definisi Fungsi

() => number | undefined

setTextTracks()

Mengatur array caption WebVTT.

Definisi fungsi

(textTracks: Array<{ kind: string, label: string, src: string, srclang: string }>) => void

Parameter

Name

Type

Required

Description

textTracks

Array<object>

Yes

Contoh:

player.setTextTracks([ { kind: 'subtitles', label: 'Chinese', src: 'caption-url', srclang: 'zh-CN' },{ kind: 'subtitles', label: 'English (US)', src: 'caption-url', srclang: 'en-US' }])
Catatan

Didukung di Web Player SDK versi 2.12.0 dan yang lebih baru.

setLogo()

Atur gambar logo kustom.

Definisi fungsi

(logoList: Array<{ width: number, position: string, origin: string, src: string }>) => void

Parameter

Name

Type

Required

Description

logoList

Array<object>

Yes

Contoh:

player.setLogo([{
      width: 30,
      position: 'bottom-right',
      origin: 'content',
      src: 'a.jpg'
    },
    {
      width: 20,
      position: 'bottom-right',
      offsetY: -20,
      origin: 'content',
      src: 'b.jpg'
    }])

Untuk deskripsi bidang, lihat properti: logo.

setWatchTime()

Perbarui watchStartTime/watchEndTime video saat ini secara dinamis.

Definisi fungsi

(start: number, end: number) => void

Parameter

Name

Type

Required

Description

start

string

Yes

Waktu mulai.

end

string

Yes

Waktu akhir.

setNextWatchTime()

Atur watchStartTime/watchEndTime video berikutnya. Jika Anda menggunakan loadByUrl atau replayByVidAndPlayAuth untuk beralih video, dan video berikutnya memiliki rentang waktu berbeda dari video saat ini, Anda harus memanggil setNextWatchTime terlebih dahulu.

Definisi fungsi

(start: number, end: number) => void

Parameter

Name

Type

Required

Description

start

string

Yes

Waktu mulai.

end

string

Yes

Waktu akhir.

setStartEnd()

Perbarui start/end video saat ini secara dinamis.

Definisi Fungsi

(start: number, end: number) => void

Parameter

Name

Type

Required

Description

start

string

Yes

Waktu mulai.

end

string

Yes

Waktu akhir.

setNextStartEnd()

Atur start/end video berikutnya. Jika Anda menggunakan loadByUrl atau replayByVidAndPlayAuth untuk beralih video, dan video berikutnya memiliki rentang segmen berbeda dari video saat ini, Anda harus memanggil setNextStartEnd terlebih dahulu.

Definisi Fungsi

(start: number, end: number) => void

Parameter

Name

Type

Required

Description

start

string

Yes

Waktu mulai.

end

string

Yes

Waktu akhir.

takeSnapshot()

Ambil tangkapan layar. String base64 yang dikembalikan dapat digunakan langsung sebagai nilai img.src. Anda dapat menggunakan setSnapshotProperties untuk mengonfigurasi kualitas tangkapan layar dan snapshotWatermark untuk menambahkan watermark.

Catatan: Fungsi tangkapan layar mungkin tidak berfungsi di beberapa browser seluler tempat tag video dibajak (seperti UC Browser atau QQ Browser).

Definisi Fungsi

() => { time: number, base64: string, binary: string, error: Error | null }

Nilai kembalian

Name

Type

Description

time

string

Waktu tangkapan layar.

base64

string

Konten tangkapan layar yang dikodekan Base64.

binary

string

Representasi string biner dari konten tangkapan layar.

error

Error

Detail error tangkapan layar apa pun.

showControlBar()

Tampilkan bilah kontrol.

Definisi Fungsi

() => void

hideControlBar()

Sembunyikan bilah kontrol.

Definisi Fungsi

() => void

Event

Peristiwa Pemutar

Name

Description

ready

UI player selesai dirender. Picu logika inisialisasi UI setelah event ini untuk menghindari ditimpa oleh inisialisasi default.

Catatan

Anda hanya dapat memanggil metode player setelah event ini terjadi.

play

Dipicu saat pemutaran dilanjutkan dari jeda.

pause

Dipicu saat pemutaran dijeda.

canplay

Dipicu saat audio atau video dapat mulai diputar. Event ini mungkin dipicu beberapa kali. Hanya untuk player HTML5.

playing

Dipicu berulang kali selama pemutaran.

ended

Dipicu saat video saat ini selesai diputar.

liveStreamStop

Dipicu saat streaming langsung berhenti. Untuk streaming langsung HLS, ini dipicu setelah lima kali percobaan ulang gagal. Beri tahu lapisan aplikasi bahwa stream telah berhenti atau perlu dimuat ulang.

Catatan

Jika streaming langsung HLS gagal atau terputus, player secara otomatis mencoba ulang lima kali. Jangan menerapkan logika percobaan ulang tambahan di lapisan aplikasi.

onM3u8Retry

Dipicu sekali setiap kali player mencoba ulang setelah gangguan streaming langsung HLS.

hideBar

Dipicu saat bilah kontrol disembunyikan secara otomatis.

showBar

Bilah kontrol secara otomatis menampilkan (event).

waiting

Dipicu saat buffering data.

timeupdate

Dipicu saat posisi pemutaran berubah. Panggil getCurrentTime() untuk mendapatkan waktu pemutaran saat ini.

snapshoted

Dipicu saat tangkapan layar selesai.

requestFullScreen

Dipicu saat masuk layar penuh.

cancelFullScreen

Dipicu saat keluar layar penuh. Tidak dipicu di iOS.

error

Dipicu saat terjadi error.

startSeek

Parameter mengembalikan waktu pembuatan titik seret pada awal operasi seret.

completeSeek

Saat Anda menyelesaikan operasi seret, parameter menunjukkan timestamp titik seret.

resolutionChange

Dipicu saat sumber streaming langsung mengubah resolusi.

seiFrame

Dipicu saat menerima pesan SEI melalui HLS atau FLV.

rtsFallback

Dipicu saat RTS beralih. Parameter reason menunjukkan alasan fallback terjadi. Parameter fallbackUrl berisi URL fallback.

settingSelected

Dipicu saat pengaturan (misalnya, kecepatan pemutaran, definisi, teks terjemahan) dipilih.

Catatan

Karena plugin kecepatan open-source tidak disinkronkan dengan player, menggunakannya memerlukan kode kustom dan rekompilasi. Definisikan listener event Anda sendiri. Untuk menggunakan event settingSelected player, hapus plugin ini.

/**
 * Dipicu saat pengaturan dipilih, misalnya beralih ke kecepatan 1.25×:
 * {name: 'Speed', type: 'speed', text: '1.25×', key: 1.25}
 */

rtsTraceId

Event ini dipicu ketika penarikan aliran RTS berhasil, dan Anda dapat Berlangganan ke event ini untuk memperoleh RTS TraceId. Dalam keluaran log, bidang `traceId` dari parameter data.paramData adalah TraceId untuk penarikan aliran, dan bidang `source` adalah alamat pemutaran aliran RTS saat ini.

player.on('rtsTraceId', function(data) {
  console.log('[EVENT]rtsTraceId', data.paramData);
})

autoplay

Dipicu saat autoplay berhasil atau gagal. Parameter callback event.paramData adalah true saat berhasil dan false saat gagal. Saat gagal, diperlukan interaksi pengguna untuk memulai pemutaran.

mutedAutoplay

Dipicu saat autoplay senyap berhasil dan autoplayPolicy.fallbackToMute diatur ke true.

videoUnavailable

Dipicu saat pemutaran video gagal karena encoding tidak didukung, menyebabkan Layar hitam. Misalnya, memutar video H.265 di browser yang tidak mendukung H.265 menghasilkan layar hitam dengan audio saja.

Langganan Event

  • Anda dapat berlangganan event menggunakan metode on pada instans player. Contoh:

    function handleReady() {};
    player.on('ready', handleReady);
    // Beberapa event dipicu secara sering. Gunakan player.one untuk mendengarkan sekali.
    player.one('canplay', () => {});
  • Anda dapat berhenti berlangganan event menggunakan metode off pada instans player. Contoh:

    player.off('ready',handleReady);