Skip to content

API 文档

这一页是当前 h265web.js PRO 浏览器 SDK 的精简参考。

路径规则

当前 SDK 对资源路径和媒体路径都支持以下写法:

  • 完整 URL:https://example.com/output/h265web_wasm.js
  • 站点绝对路径:/output/h265web_wasm.js
  • 相对路径:./output/h265web_wasm.js

如果你希望四个 SDK 资源统一从同一个目录解析,可以使用 base_url

构建流程

推荐的公开接入方式:

  1. 创建播放器对象。
  2. 绑定需要的回调。
  3. 调用 build(config)
  4. 调用 load_media(mediaUrl)
js
const ylplayer = H265webjsPlayer();

ylplayer.on_ready_show_done_callback = function () {
  console.log('ready');
};

ylplayer.video_probe_callback = function (mediaInfo) {
  console.log('probe', mediaInfo);
};

ylplayer.build({
  player_id: 'canvas111',
  base_url: './output/',
  wasm_js_uri: 'h265web_wasm.js',
  wasm_wasm_uri: 'h265web_wasm.wasm',
  ext_src_js_uri: 'extjs.js',
  ext_wasm_js_uri: 'extwasm.js',
  width: '100%',
  height: 480,
  auto_play: true,
  ignore_audio: false
});

ylplayer.load_media('./resource/demo.mp4');

build(config)

配置字段

参数类型必需说明
player_idstring播放器容器元素 id
wasm_js_uristringh265web_wasm.js 的资源路径
wasm_wasm_uristringh265web_wasm.wasm 的资源路径
ext_src_js_uristringextjs.js 的资源路径
ext_wasm_js_uristringextwasm.js 的资源路径
base_urlstringSDK 资源统一基准路径
widthnumber | string播放器宽度
heightnumber | string播放器高度
colorstring播放器背景色
auto_playboolean媒体就绪后自动播放
readframe_multi_timesnumberdemux 读取倍率
corestring显式指定内核:mse_hevcwasm_hevcwebcodec_hevc
ignore_audioboolean是否忽略音频
media_uristring可选媒体地址;公开示例仍推荐 build() 后再 load_media()

核心方法

release()

js
ylplayer.release();

load_media(mediaUrl)

js
ylplayer.load_media('./resource/hevc_test_moov_set_head_16s.mp4');

change_media(mediaUrl)

js
ylplayer.change_media('/resource/another-demo.mp4');

play()

js
ylplayer.play();

pause()

js
ylplayer.pause();

seek(seconds)

js
ylplayer.seek(10);

set_playback_rate(rate)

js
ylplayer.set_playback_rate(2.0);

set_voice(volume)

js
ylplayer.set_voice(0.5);

set_mute()

js
ylplayer.set_mute();

screenshot(imgId)

html
<img id="screenshot" style="width:400px;height:340px;background:#e9e9e9;" />
js
ylplayer.screenshot('screenshot');

next_frame()

js
ylplayer.next_frame();

resize(width, height)

js
ylplayer.resize(640, 480);

fullScreen()

js
ylplayer.fullScreen();

closeFullScreen()

js
ylplayer.closeFullScreen();

必需回调

on_ready_show_done_callback

js
ylplayer.on_ready_show_done_callback = function () {
  console.log('on_ready_show_done_callback');
};

video_probe_callback(mediaInfo)

js
ylplayer.video_probe_callback = function (mediaInfo) {
  console.log('video_probe_callback', mediaInfo);
};

播放与跳转回调

on_play_time(pts)

js
ylplayer.on_play_time = function (pts) {
  console.log('on_play_time', pts);
};

on_play_finished()

js
ylplayer.on_play_finished = function () {
  console.log('on_play_finished');
};

on_seek_start_callback(seekTarget)

js
ylplayer.on_seek_start_callback = function (seekTarget) {
  console.log('on_seek_start_callback', seekTarget);
};

on_seek_done_callback(seekTarget)

js
ylplayer.on_seek_done_callback = function (seekTarget) {
  console.log('on_seek_done_callback', seekTarget);
};

缓存相关回调

on_cache_process_callback(timestamp)

js
ylplayer.on_cache_process_callback = function (timestamp) {
  console.log('on_cache_process_callback', timestamp);
};

on_load_caching_callback()

js
ylplayer.on_load_caching_callback = function () {
  console.log('on_load_caching_callback');
};

on_finish_cache_callback(data)

js
ylplayer.on_finish_cache_callback = function (data) {
  console.log('on_finish_cache_callback', data);
};