SellyCloud Player

SellyCloud Player is a highly customizable, lightweight HTML5 video player designed for modern web and mobile applications. Built with performance and user experience in mind, it provides seamless playback across all devices and browsers while offering extensive customization options.

Overview

SellyCloud Player combines powerful features with simplicity. Whether you're embedding a single video or building a complete video platform, our player adapts to your needs with minimal setup and maximum flexibility.

Quick Start

1. Import SDK

<!-- UMD Method -->
<script src="dist/sellycloudwebsdk.umd.js"></script>
<script>
  const client = SellyCloudWebSdk.CreateSellyRtcEngine();
</script>
        

// ES Module Method
import { CreateSellyRtcEngine } from './dist/sellycloudwebsdk.es.js';
const client = CreateSellyRtcEngine();
        

2. Listen to Events

// Log output
client.on('log', (msg) => {
  console.log('[SDK]', msg);
});

// Receive remote stream - bind to video element
client.on('play-stream', (stream) => {
  const player = document.getElementById('player');
  if (player && stream) {
    player.srcObject = stream;
  }
});

// ICE connection state change
client.on('play-ice', (state) => {
  console.log('Pull stream ICE state:', state);
  // state: 'new' | 'checking' | 'connected' | 'completed' | 'failed' | 'disconnected' | 'closed'
});

// Pull stream success
client.on('play-success', ({ app, stream, zlm, preferredTcp }) => {
  console.log('Pull stream success:', { app, stream });
});

// Pull stream stopped
client.on('play-stopped', () => {
  console.log('Pull stream stopped');
});
        

3. Start Playing

When pulling stream, you need to pass the zlm server address (obtained from share link):

async function startPlay() {
  try {
    await client.startPlay({
      app: 'live',                           // Application name
      stream: 'channel123',                  // Channel ID
      zlm: 'http://47.77.192.225:1080',      // Server address (obtained from share link)
      preferredTcp: '0'                      // Optional: '0' UDP preferred (default), '1' TCP preferred
    });
  } catch (err) {
    console.error('Pull stream failed:', err.message);
  }
}
        

4. Stop Playing

client.stopPlay();

Player API

1. Methods

CreateSellyRtcEngine()

Create an RTC client instance.

Returns: SellyRtcEngine - RTC client instance

startPlay(options)

Start pulling and playing stream.

Parameters:

Parameter	Type	Required	Default	Description
`options.app`	`string`	Yes	-	Application name (e.g., `'live'`)
`options.stream`	`string`	Yes	-	Channel ID
`options.zlm`	`string`	No	SDK default	ZLMediaServer address, obtained from share link or publisher
`options.preferredTcp`	`string`	No	`'0'`	Transport protocol: `'0'` UDP preferred, `'1'` TCP preferred

Returns: Promise<{ app, stream, zlm, preferredTcp }>

Return Field	Type	Description
`app`	`string`	Application name
`stream`	`string`	Channel ID
`zlm`	`string`	ZLMediaServer address
`preferredTcp`	`string`	Transport protocol used

Triggers Events: play-ice, play-stream, play-success

stopPlay()

Stop pulling stream.

Returns: void

Triggers Events: play-stopped

2. Events

Event List

Event Name	Callback Parameters	Description
`log`	`msg: string`	SDK internal log message
`play-stream`	`stream: MediaStream`	Remote media stream ready, bind to video element for playback
`play-ice`	`state: string`	Pull stream ICE connection state change
`play-success`	`{ app, stream, zlm, preferredTcp }`	Pull stream successful
`play-stopped`	None	Pull stream stopped

play-success Callback Parameters

Field	Type	Description
`app`	`string`	Application name
`stream`	`string`	Channel ID
`zlm`	`string`	ZLMediaServer address
`preferredTcp`	`string`	Transport protocol used

ICE State Values

State	Description
`new`	Initial state
`checking`	Checking connection
`connected`	Connected
`completed`	Connection completed
`failed`	Connection failed
`disconnected`	Connection disconnected
`closed`	Connection closed

Resources & Support

💡 NEED HELP?

Check out our Interactive Playground to experiment with player configurations and see instant results.