Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@flussonic/flussonic-webrtc-player
Advanced tools
Readme
Flussonic WebRTC Player is a JavaScript library for publishing and playing video via WebRTC. It relies on Flussonic backend, HTML5 video and WebRTC.
Install it in your project and use in your website or application to exchange video via WebRTC with Flussonic.
The library contains classes:
Publisher
for video publication from your app to Flussonic Media Server.Player
for playback of published video in your app.Install flussonic-webrtc-player
from NPM by running the command:
npm install --save @flussonic/flussonic-webrtc-player
To run embed version of player in development mode, you must build it first:
yarn build:flussonic
and then run it in dev mode:
yarn start:embed
Used to stream video via WebRTC from a client app to other clients through Flussonic.
import {
Publisher,
PUBLISHER_EVENTS,
PUBLISHER_STATUSES,
} from '@flussonic/flussonic-webrtc-player';
// ...
const publisher = new Publisher(url, opts, shouldLog);
<script type="text/javascript" src="../../dist/index.js"></script>
<script>
const { Publisher, PUBLISHER_EVENTS, PUBLISHER_STATUSES } =
window.FlussonicWebRTCPlayer;
// ...
const publisher = Publisher(url, opts, shouldLog);
</script>
Where:
url
- a stream's URL.
opts
- a plain object, it can include:
preview?: HTMLMediaElement
- if passed, then shows preview before the stream is loaded. This is an element in which you can output a published stream without creating a separate player listening to the same stream.
previewOptions?: object
- preview options object.
previewOptions?.autoplay?
- if true
, the playback of the preview will start automatically.
previewOptions?.controls?
- if true
, the preview will have controls.
previewOptions?.muted?
- if true
, the preview will be muted.
inputStreams
- now you can send your MediaStreamTracks directly to publisher and publish them
constraints
- MediaStreamConstraints.
shouldLog
- if passed, internal events will be logged to console (true
|false
).
returnCapabilities()
- callback for getting video device capabilities.
password
- pass a stream password.
authTokenName
- set a custom password token name
tokenValue
- set a token value
maxBitrate
- sets the maxBitrate iceCandidate option in the publisher.
onEvent()
- Publisher events callback. For tracking connection states and player workflow. Events are listed below:
{ type: 'started', started_at: #Date# }
- runs when the streaming is started.{ type: 'closed', closed_at: #Date# }
- runs when the streaming is closed.{type: 'connection state', connection: 'connected' }
- runs when connection state changes. States are listed below:
opened
- when connection is openedconnected
- when ICE candidates is connectedclosed
- when user performed connection closedisconnected
- when server side closed ICE candidates connectioncanvasCallback
- callback function than enables both canvas preview and canvas publish. Returns a canvas html element that you can modify in realtime to add some video effects to publishing video stream.
radeonCheck
- Enable workaround for the issue when some AMD Radeon(tm) publish with a low bitrate. This is experimental option, will be redesigned.
'initializing'|'streaming'|'stopped'
.status
to streaming
.start(opts?: {
openPeerConnectionOptions?: {
getMediaOptions?: {
// Called if mediaDevices.getUserMedia fails
onGetUserMediaError: (error: Error) => void
}
}
}) => void
shareScreen() - allows the user to activate screen casting after publishing has started. To stop screen sharing you got to call this method again.
stop() - stops stream's tracks; sets the current publisher status to stopped
.
restart() - restarts the publishing process.
on(event, cb) - subscribes for event
with the callback cb
. Events are listed below:
STREAMING
- runs when an ICE candidate is received and the streaming is started.mute() - mutes the published audio track.
import {
Publisher,
PUBLISHER_EVENTS,
PUBLISHER_STATUSES,
} from '@flussonic/flussonic-webrtc-player';
const publisher = new Publisher(
// The URL to a Flussonic stream that has a published source
'https://FLUSSONIC_IP/STREAM_NAME',
{
// A <video> or <audio> element for previewing a published stream
preview: document.getElementById('preview'),
previewOptions: {
autoplay: true,
controls: true,
muted: false,
},
constraints: {
video: {
width: { min: 320, ideal: 1920, max: 4096 },
height: { min: 240, ideal: 1080, max: 2160 },
},
audio: true,
},
},
// Log to console the Publisher's internal debug messages?
true,
);
publisher.on(PUBLISHER_EVENTS.STREAMING, () => {
console.log('Streaming started');
});
publisher.start();
// ...
publisher.stop();
Used for playing back video from Flussonic via WebRTC on a client.
import { Player, PLAYER_EVENTS } from '@flussonic/flussonic-webrtc-player';
// ...
const player = new Player(element, url, opts, shouldLog);
<script type="text/javascript" src="../../dist/index.js"></script>
<script>
const { Player, PLAYER_EVENTS } = window.FlussonicWebRTCPlayer;
// ...
const player = new Player(element, url, opts, shouldLog);
</script>
Where:
element
- a <video>
DOM element used for viewing a stream.
url
- the stream's URL.
opts
- a plain object, it can include options:
autoplay
- starts playback automatically (true
|false
).
shouldLog
- if passed, internal events will be logged to console (true
|false
).
onMediaInfo(tracks, abr)
- returns MediaInfo object with tracks information, and ABR(Adaptive Bitrate Streaming) indication flag
onTrackInfo(trackInfo)
- returns a track info on track change, useful for ABR mode info
onEvent()
- Player events callback.
authTokenName
- set a custom password token name
tokenValue
- set a token value
start_track
- initiates the playback track (v1a1
| auto
).
videoDisabled
- disables the video transceiver.
audioDisabled
- disables the audio transceiver.
play() - starts the playback.
changeTracks(['v1','a1']) - manualy change tracks. Can be [] or 'auto', if source has ABR. Tracklist and abr flag can be achieved by using onMediaInfo callback.
stop() - stops the playback, sets srcObject
of <video>
to null.
destroy() - calls stop()
and unbinds all listeners.
on(event, cb) - subscribes for event
with the callback cb
. Events are listed below:
FAIL
- when an error occurs, runs with the message that describes this error.PLAY
- runs when playback starts.DEBUG
- for development puproses.getMediaInfo() - retrieves media information about the stream.
import { Player, PLAYER_EVENTS } from '@flussonic/flussonic-webrtc-player';
const player = new Player(
// A <video> or <audio> element to playback the stream from Flussonic
document.getElementById('player'),
// The URL of the stream from Flussonic
'https://FLUSSONIC_IP/STREAM_NAME',
// Options
{ autoplay: true },
// Log to console the Player's internal debug messages?
true,
);
player.on(PLAYER_EVENTS.PLAY, (msg) => console.log(`Play: ${msg}`));
player.on(PLAYER_EVENTS.DEBUG, (msg) => console.log(`Debug: ${msg}`));
player.play();
player.changeTracks('auto');
// ...
player.stop();
// ...
player.destroy();
FAQs
Flussonic Webrtc publish and playback
The npm package @flussonic/flussonic-webrtc-player receives a total of 2,030 weekly downloads. As such, @flussonic/flussonic-webrtc-player popularity was classified as popular.
We found that @flussonic/flussonic-webrtc-player demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.