JSMpeg Player(TS Player)
- JSMpeg player is based on jsmpeg.
- The video must be compressed into the TS format of MPEG1 / MP2.
- Apple device automatically plays without sound, you need to guide the user to click on the video in the lower right corner of the video icon to unlock the sound.(no similar problem in non-autoplay mode)
How to use
Install
$ npm install jsmpeg-player --save
# or
$ yarn add jsmpeg-player
Usage
import JSMpeg from 'jsmpeg-player';
# OR
let JSMpeg = require('jsmpeg-player');
new JSMpeg.VideoElement(videoWrapper, videoUrl, [, options])
-
videoWrapper
: [string|element] the wrapper of video. Height and width of wrapper must be initialized -
videoUrl
: [string] a url to an MPEG .ts file -
The
options
supports:poster
: [string] URL to an image to use as the poster to show before the video plays.(Recommended to set it manually)autoplay
: [boolean] whether to start playing immediately. Defaultfalse
.loop
: [boolean] whether to loop the video (static files only). Defaultfalse
.[overwrite]aspectPercent
: [string] Aspect ratio converted to percentage. E.g: '16:9' =>'56.25%'
. Default'56.25%'
.picMode
: [boolean] picture node (no playButton). Defaultfalse
.chunkSize
the chunk size in bytes to load at a time. Default1024*1024
(1mb).hookInPlay
: [function] The hook function when the video play.hookInPause
: [function] The hook function when the video pause.hookInStop
: [function] The hook function when the video stop.- More options can view the jsmpeg options
-
JSMpeg.VideoElement
instance supports the following methods:destroy()
: Empty videoWrapper.
-
JSMpeg.VideoElement.player
instance API can view the JSMpeg.Player API
Use in browser
<div id="videoWrapper"></div>
<script src="JSMpeg.min.js"></script>
<script>
var videoUrl = '../static/media/test_video.ts';
new JSMpeg.VideoElement('#videoWrapper', videoUrl);
</script>
CDN
To use via a CDN include this in your html:
<script src="https://cdn.jsdelivr.net/npm/jsmpeg-player@1/build/JSMpeg.min.js"></script>
jsmpeg by ffmpeg. E.g:
Encoding Video/Audio for$ ffmpeg -i input.mp4 -f mpegts
-codec:v mpeg1video -s 640x360 -b:v 700k -r 25 -bf 0
-codec:a mp2 -ar 44100 -ac 1 -b:a 64k
output.ts
- options
-s
: video size-b:v
: video bit rate-r
: frame rate-ar
: sampling rate-ac
: number of audio channels-b:a
: audio bit rate