webmediaplugin-websdk

面向浏览器项目的 WebMediaPlugin SDK 封装。

业务对接文档见：docs/integration.zh-CN.md。

npm 发布手册见：docs/publish.zh-CN.md。

快速开始

import { WebMediaPlugin } from 'webmediaplugin-websdk';

const sdk = WebMediaPlugin.init({
  brokerUrl: 'ws://localhost:10001',
  auth: { username: 'admin', password: '123' },
  heartbeat: 5000,
});

await sdk.ready;

await sdk.tts.speak({ text: '测试播报', volume: 80, rate: 0, playMode: 0 });
await sdk.screenCapture.startRecord({ outputPath: '', quality: 80, fps: 30 });
await sdk.fileUploader.submitAlarmVideos({
  filePath,
  uploadUrl,
  updateUrl,
  token,
  alarmId,
  restPropertyName: 'videoUrl',
  parameters: {
    inspectorRecordId: fileId,
    videoUrl: '',
  },
});
await sdk.intercom.init({
  local: 'localCanvas',
  remote: 'remoteCanvas',
  device: { id: '1000', name: '测试设备-1000', platformCode: 'libon', platformId: '1000' },
});
await sdk.intercom.call();
await sdk.intercom.hangup();

公开能力

SDK 顶层：

• WebMediaPlugin.init(options)
• sdk.ready
• sdk.uniqueId
• sdk.connect()
• sdk.ensureConnected()
• sdk.disconnect()
• sdk.destroy()
• sdk.isConnected()
• sdk.on() / sdk.off()
• sdk.screenCapture
• sdk.tts
• sdk.fileUploader
• sdk.intercom

截图信息：

await sdk.screenCapture.getScreenshotInfo({
  filePath: 'C:/Users/Public/Pictures/sdk-demo.png',
  token: '截图返回的 token',
  responseType: 'base64',
});

内部请求：POST ${httpHost}/temp/down。httpHost 支持初始化传入，不传时按 brokerUrl 同主机默认端口 10002。

base64 返回 { fileName, fileBase64 }，业务展示图片时自行拼接 data:image/png;base64,${fileBase64}。

能力销毁：

• sdk.tts.destroy()
• sdk.screenCapture.destroy()
• sdk.fileUploader.destroy()
• sdk.intercom.destroy()

Rpc.js、erpc.js、EasyMedia、HostClient、requestAsync 均不作为公开 API 导出。

对讲运行台：

const sessionId = await sdk.intercom.init({
  local: 'localCanvas',
  remote: 'remoteCanvas',
  device: {
    id: '1000',
    name: '测试设备-1000',
    platformCode: 'libon-hel',
    platformId: '1000',
  },
});

await sdk.intercom.call();
await sdk.intercom.speak(true);
await sdk.intercom.speak(false);
await sdk.intercom.listen();
await sdk.intercom.hangup();

await sdk.intercom.startBroadcast({ numbers: '1001,1002,1003', volume: 50 });
await sdk.intercom.getBroadcastNumbers();
await sdk.intercom.setBroadcastVolume(80);
await sdk.intercom.stopBroadcast();
await sdk.intercom.destroy();

platformCode 按前缀路由：libon-hel -> libon/...，spon-vx -> spon/...。本期只接入新版 erpc-demo-intercom.html 运行台能力，不做配置保存。

生命周期

sdk.ready 只表示 SDK 初始化时的首次连接结果。页面后续调用能力前，建议使用：

await sdk.ensureConnected();

页面离开时，业务按实际使用的能力自行销毁：

await sdk.tts.destroy();
await sdk.screenCapture.destroy();
sdk.fileUploader.destroy();
await sdk.intercom.destroy();

退出系统或不再使用 SDK 实例时，调用：

sdk.destroy();

sdk.destroy() 只负责销毁 SDK 实例并断开 WebSocket；各主能力的运行态由能力自身 destroy() 处理。

调试

默认不暴露原始 topic 调用。仅当 debug: true 时提供：

await sdk.raw?.call('tts/stop', []);

操作回调

const sdk = WebMediaPlugin.init({
  brokerUrl: 'ws://localhost:10001',
  onOperation: (event) => {
    console.log(event.name, event.topic, event.status, event.data, event.error);
  },
});

sdk.on('operation', (event) => {
  console.log('operation event', event);
});

框架集成

Vue Router 示例：

router.beforeEach(async (_to, _from, next) => {
  await sdk.tts.destroy();
  await sdk.screenCapture.destroy();
  sdk.fileUploader.destroy();
  await sdk.intercom.destroy();
  next();
});

React 示例：

useEffect(() => {
  return () => {
    sdk.tts.destroy().catch(console.error);
    sdk.screenCapture.destroy().catch(console.error);
    sdk.fileUploader.destroy();
    sdk.intercom.destroy().catch(console.error);
  };
}, []);