mirror of
https://github.com/bytedance/xgplayer.git
synced 2025-04-05 03:05:02 +08:00
docs: ✏️ update readme
This commit is contained in:
gemstone
parent
e1e8cf0b11
commit
bed41659c1
43
README.md
43
README.md
@ -23,7 +23,7 @@ it can be staged loading for that does not support streaming mp4. This means sea
|
||||
|
||||
1. Install
|
||||
|
||||
```
|
||||
```bash
|
||||
$ npm install xgplayer
|
||||
```
|
||||
|
||||
@ -52,45 +52,28 @@ it can be staged loading for that does not support streaming mp4. This means sea
|
||||
|
||||
### Plugins
|
||||
|
||||
xgplayer provides more plugins. Plugins are divided into two categories: one is self-starting, and another inherits the player's core class named xgplayer. In principle, the officially provided plug-ins are self-starting and the packaged third-party libraries are inherited. Some feature plug-ins themselves can provide a downgrade scenario that suggests a self-start approach, or an inheritance approach if not. The player supports custom plugins for more content viewing [plugins](http://h5player.bytedance.com/en/plugins/)
|
||||
|
||||
The following is how to use a self-starting plug-in：
|
||||
|
||||
```js
|
||||
import Player from 'xgplayer';
|
||||
import 'xgplayer-mp4';
|
||||
|
||||
const player = new Player({
|
||||
id: 'video',
|
||||
url: '//abc.com/test.mp4'
|
||||
})
|
||||
```
|
||||
|
||||
<code>xgplayer-mp4</code>plugin is self-starting, It loads mp4 video itself, parses mp4 format, implements custom loading, buffering, seamless switching, and so on. it will automatically downgrade devices that do not support [MSE](https://www.w3.org/TR/media-source/). [details](http://h5player.bytedance.com/en/plugins/#xgplayer-mp4)
|
||||
|
||||
|
||||
|
||||
### Mobile Support
|
||||
|
||||
xgplayer supports mobile terminal, but android device brand and system are numerous, there are much compatibility problems, the player provides whitelist mechanism to ensure the perfect operation in mobile terminal. [whitelist](http://h5player.bytedance.com/en/config/#whitelist)
|
||||
|
||||
xgplayer provides more plugins and supports custom plugins, for more content viewing [plugins](http://h5player.bytedance.com/en/plugins/). There are many built-in plugins in the player, if you need to close specific plugins, you can disable them by [ignores](https://h5player.bytedance.com/config/#ignores) configuration
|
||||
|
||||
|
||||
### Dev
|
||||
|
||||
For debugging, we provide the example video resource which size is large in github. You can clone the whole git repository which includes codes and example videos with 'git clone --recurse-submodules -j8'. With 'git clone' you will pull only codes of xgplayer and its plugins.
|
||||
In order to debug by developers, we provide demos code in the fixtures directory of the repo. The player uses yarn for package management, and it only takes a few simple steps to start debugging in the repo
|
||||
|
||||
```
|
||||
$ git clone --recurse-submodules -j8 git@github.com:bytedance/xgplayer.git # OR git clone git@github.com:bytedance/xgplayer.git
|
||||
```bash
|
||||
$ cd xgplayer
|
||||
$ npm install
|
||||
$ npm run dev
|
||||
$ yarn
|
||||
$ yarn dev:xgplayer
|
||||
```
|
||||
|
||||
please visit [http://localhost:9090/examples/index.html](http://localhost:9090/examples/index.html)
|
||||
To debug other plugins, please refer to the scripts command provided in package.json in the root directory of the repo, such as:
|
||||
|
||||
```bash
|
||||
$ yarn dev:hls
|
||||
$ yarn dev:flv
|
||||
$ yarn dev:mp4
|
||||
```
|
||||
|
||||
### Agreement
|
||||
### License
|
||||
|
||||
Welcome to use xgplayer! Please read the following terms carefully. Using xgplayer means that you accept and agree to the terms.
|
||||
1. Xgplayer is licensed under the [MIT](http://opensource.org/licenses/MIT) License. You comply with its obligations by default.
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
|
||||
1. 安装
|
||||
|
||||
```
|
||||
```bash
|
||||
$ npm install xgplayer
|
||||
```
|
||||
|
||||
@ -56,41 +56,26 @@
|
||||
|
||||
### 插件
|
||||
|
||||
西瓜播放器提供了较多的插件，插件分两类：一部分是自启动的，一部分是继承播放器核心类 xgplayer 的。原则上官方提供插件都是自启动的，封装的第三方类库都是继承方式。有些功能插件本身能提供降级方案建议使用自启动方式，否则建议使用继承方式。播放器支持自定义插件，更多内容查看 [插件](http://h5player.bytedance.com/plugins/)
|
||||
|
||||
对于自启动的插件使用方法如下：
|
||||
|
||||
```js
|
||||
import Player from 'xgplayer'
|
||||
import 'xgplayer-mp4'
|
||||
|
||||
let player = new Player({
|
||||
id: 'video',
|
||||
url: '//abc.com/test.mp4'
|
||||
})
|
||||
```
|
||||
|
||||
<code>xgplayer-mp4</code>插件就是自启动的，它会自己加载 mp4 视频、解析 mp4 格式，实现自定义加载、缓冲、无缝切换等[详情]((http://h5player.bytedance.com/plugins/#xgplayer-mp4))。对于不支持 [MSE](https://www.w3.org/TR/media-source/) 的设备自动降级。
|
||||
西瓜播放器提供了较多的插件，并支持自定义插件，更多内容查看 [插件](http://h5player.bytedance.com/plugins/)。播放器内有不少内置插件，如果需要关闭某些插件可以通过 [ignores](https://h5player.bytedance.com/config/#ignores) 配置禁用
|
||||
|
||||
|
||||
### Mobile Support
|
||||
### 开发调试
|
||||
|
||||
西瓜播放器支持移动端，不过安卓设备品牌和系统众多，兼容性问题很多，播放器提供白名单机制保证在移动端完美的运行。[白名单机制](http://h5player.bytedance.com/config/#%E7%99%BD%E5%90%8D%E5%8D%95)
|
||||
为了方便开发者调试，我们在仓库 fixtures 目录内提供了示例代码。播放器使用 yarn 进行包管理，只需简单几步即可开始在仓库内启动调试
|
||||
|
||||
|
||||
### Dev
|
||||
|
||||
为了方便开发者调试，我们提供了示例视频资源。示例文件较大，可使用 git clone --recurse-submodules -j8 命令完整拉取源码和示例文件；如果你只对源码感兴趣可以使用 git clone 命令仅拉取源码部分。
|
||||
|
||||
```
|
||||
$ git clone --recurse-submodules -j8 git@github.com:bytedance/xgplayer.git # 或者：git clone git@github.com:bytedance/xgplayer.git
|
||||
```bash
|
||||
$ cd xgplayer
|
||||
$ npm install
|
||||
$ npm run dev
|
||||
$ yarn
|
||||
$ yarn dev:xgplayer
|
||||
```
|
||||
|
||||
访问 [http://localhost:9090/examples/index.html](http://localhost:9090/examples/index.html)
|
||||
其它插件启动，请参考仓库根目录内 package.json 提供 scripts 命令，比如：
|
||||
|
||||
```bash
|
||||
$ yarn dev:hls
|
||||
$ yarn dev:flv
|
||||
$ yarn dev:mp4
|
||||
```
|
||||
|
||||
### 使用协议
|
||||
|
||||
|
||||
@ -5,9 +5,6 @@
|
||||
<a href="https://www.npmjs.com/package/xgplayer" target="_blank">
|
||||
<img src="https://img.shields.io/npm/v/xgplayer.svg" alt="npm">
|
||||
</a>
|
||||
<a href="https://www.npmjs.com/package/xgplayer">
|
||||
<img src="https://img.shields.io/npm/dm/xgplaer.svg" alg="download">
|
||||
</a>
|
||||
<a href="https://www.npmjs.com/package/xgplayer" target="_blank">
|
||||
<img src="https://img.shields.io/npm/l/xgplayer.svg" alt="license">
|
||||
</a>
|
||||
@ -19,14 +16,14 @@
|
||||
|
||||
### Introduction
|
||||
|
||||
xgplayer is a web video player library. it has designed a separate, detachable UI component based on the principle that everything is componentized. More importantly, it is not only flexible in the UI layer, but also bold in its functionality: it gets rid of video loading, buffering, and format support for video dependence. Especially on mp4
|
||||
it can be staged loading for that does not support streaming mp4. This means seamless switching with clarity, load control, and video savings. It also integrates on-demand and live support for FLV, HLS, and dash. [Document](http://h5player.bytedance.com/)
|
||||
xgplayer is a web video player library. It has designed a separate, detachable UI component based on the principle that everything is componentized. More importantly, it is not only flexible in the UI layer, but also bold in its functionality: it gets rid of video loading, buffering, and format support for video dependence. Especially on mp4
|
||||
it can be staged loading for that does not support streaming mp4. This means seamless switching with clarity, load control, and video savings. It also integrates on-demand and live support for FLV, HLS, and dash. [Document](http://h5player.bytedance.com/en/)
|
||||
|
||||
### Start
|
||||
|
||||
1. Install
|
||||
|
||||
```
|
||||
```bash
|
||||
$ npm install xgplayer
|
||||
```
|
||||
|
||||
@ -48,51 +45,37 @@ it can be staged loading for that does not support streaming mp4. This means sea
|
||||
})
|
||||
```
|
||||
|
||||
This is the easiest way to configure the player,then it runs with video. For more advanced content, see the plug-in section or documentation. [more config](http://h5player.bytedance.com/config.html)
|
||||
This is the easiest way to configure the player, then it runs with video. For more advanced content, see the plug-in section or documentation. [more config](http://h5player.bytedance.com/en/config/)
|
||||
|
||||
|
||||
|
||||
|
||||
### Plugins
|
||||
|
||||
xgplayer provides more plugins, plugins are divided into two categories: one is self-starting, and another inherits the player's core class named xgplayer. In principle, the officially provided plug-ins are self-starting and the packaged third-party libraries are inherited. Some feature plug-ins themselves can provide a downgrade scenario that suggests a self-start approach, or an inheritance approach if not. The player supports custom plugins for more content viewing [plugins](http://h5player.bytedance.com/)
|
||||
|
||||
The following is how to use a self-starting plug-in：
|
||||
|
||||
```js
|
||||
import Player from 'xgplayer';
|
||||
import 'xgplyaer-mp4';
|
||||
|
||||
const player = new Player({
|
||||
id: 'video',
|
||||
url: '//abc.com/test.mp4'
|
||||
})
|
||||
```
|
||||
|
||||
<code>xgplayer-mp4</code>plugin is self-starting, It loads mp4 video itself, parses mp4 format, implements custom loading, buffering, seamless switching, and so on. it will automatically downgrade devices that do not support [MSE](https://www.w3.org/TR/media-source/). [details](http://h5player.bytedance.com/plugins/#xgplayer-mp4)
|
||||
|
||||
|
||||
|
||||
### Mobile Support
|
||||
|
||||
xgplayer supports mobile terminal, but android device brand and system are numerous, there are much compatibility problems, the player provides whitelist mechanism to ensure the perfect operation in mobile terminal. [whitelist](http://h5player.bytedance.com/config/#%E7%99%BD%E5%90%8D%E5%8D%95)
|
||||
|
||||
xgplayer provides more plugins and supports custom plugins, for more content viewing [plugins](http://h5player.bytedance.com/en/plugins/). There are many built-in plugins in the player, if you need to close specific plugins, you can disable them by [ignores](https://h5player.bytedance.com/config/#ignores) configuration
|
||||
|
||||
|
||||
### Dev
|
||||
|
||||
For debugging, we provide the example video resource which size is large in github. You can clone the whole git repository which includes codes and example videos with 'git clone --recurse-submodules -j8'. With 'git clone' you will pull only codes of xgplayer and its plugins.
|
||||
In order to debug by developers, we provide demos code in the fixtures directory of the repo. The player uses yarn for package management, and it only takes a few simple steps to start debugging in the repo
|
||||
|
||||
```
|
||||
$ git clone --recurse-submodules -j8 git@github.com:bytedance/xgplayer.git # OR git clone git@github.com:bytedance/xgplayer.git
|
||||
```bash
|
||||
$ cd xgplayer
|
||||
$ npm install
|
||||
$ npm run dev
|
||||
$ yarn
|
||||
$ yarn dev:xgplayer
|
||||
```
|
||||
|
||||
please visit [http://localhost:9090/examples/index.html](http://localhost:9090/examples/index.html)
|
||||
To debug other plugins, please refer to the scripts command provided in package.json in the root directory of the repo, such as:
|
||||
|
||||
```bash
|
||||
$ yarn dev:hls
|
||||
$ yarn dev:flv
|
||||
$ yarn dev:mp4
|
||||
```
|
||||
|
||||
### License
|
||||
|
||||
[MIT](http://opensource.org/licenses/MIT)
|
||||
Welcome to use xgplayer! Please read the following terms carefully. Using xgplayer means that you accept and agree to the terms.
|
||||
1. Xgplayer is licensed under the [MIT](http://opensource.org/licenses/MIT) License. You comply with its obligations by default.
|
||||
2. By default, you authorize us to place your logo in xgplayer website, which using xgplayer.
|
||||
If you have any problem, please let us know.
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user