xgplayer-mp4
Mp4 playback plugin that saves traffic
Notice
Make sure mp4 file URL supports CORS request and HTTP header range
Install
npm i xgplayer-mp4@alpha --save
npm i xgplayer@next --save
Usage
NPM
import Player from 'xgplayer'
import Mp4Plugin from 'xgplayer-mp4'
import 'xgplayer/dist/index.min.css'
const player = new Player({
id: 'vs',
plugins: [Mp4Plugin],
mp4Plugin: {
headers: { // Custom request headers
hshshshsh: 'rrrr'
},
withCredentials: true // request with credential
}
url: '{cdn_url}',
});
CDN
<link rel="stylesheet" href="//unpkg.byted-static.com/xgplayer/{version}/dist/index.min.css"/>
<script src="//unpkg.byted-static.com/xgplayer/{version}/dist/index.min.js"></script>
<script src="//unpkg.byted-static.com/xgplayer-mp4/{version}/dist/index.min.js"></script>
<script>
new window.Player({
id: 'vs',
plugins: [window.Mp4Plugin.default],
url: { mp4_url },
});
</script>
config
| key | description | value | default |
|---|---|---|---|
| withCredentials | whether cookies are to be ignored in the response | boolean | false |
| headers | request headers config | object | {} |
| videoOnly | whether to parse the video only | boolean | false |