hx-player 0.0.0-stage → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +129 -3
- package/dist/hx-player.js +31340 -0
- package/dist/hx-player.js.map +1 -0
- package/dist/hx-player.umd.js +120 -0
- package/dist/hx-player.umd.js.map +1 -0
- package/package.json +42 -6
package/README.md
CHANGED
|
@@ -1,3 +1,129 @@
|
|
|
1
|
-
#
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
# HxPlayer
|
|
2
|
+
|
|
3
|
+
华下云 Web 播放器。本目录是独立项目雏形,后续可单独拆成仓库使用。
|
|
4
|
+
|
|
5
|
+
- 已移除 `H265Player` 软解播放器
|
|
6
|
+
- 点播:`src/videoPlayer`
|
|
7
|
+
- 直播:`src/livePlayer`(WebRTC / WHEP)
|
|
8
|
+
- 构建:Vite(ES + UMD)
|
|
9
|
+
- 创建方式:`new HxPlayer()`(不再使用 `YlcPlayer.create()`)
|
|
10
|
+
|
|
11
|
+
开发构建需要 **Node.js >= 18**(Vite 6)。本机可用 `nvm use 22`。
|
|
12
|
+
|
|
13
|
+
## 安装
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
cd player_rebuild
|
|
17
|
+
npm install
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## 开发
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
npm run dev
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
默认打开 `demo/index.html`。
|
|
27
|
+
|
|
28
|
+
## 构建
|
|
29
|
+
|
|
30
|
+
```bash
|
|
31
|
+
npm run build
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
产物:
|
|
35
|
+
|
|
36
|
+
- `dist/hx-player.js` ESM
|
|
37
|
+
- `dist/hx-player.umd.js` 浏览器 script 标签
|
|
38
|
+
|
|
39
|
+
## 使用
|
|
40
|
+
|
|
41
|
+
### ESM
|
|
42
|
+
|
|
43
|
+
```js
|
|
44
|
+
import HxPlayer from 'hx-player'
|
|
45
|
+
|
|
46
|
+
const player = new HxPlayer({
|
|
47
|
+
id: 'player-container-id',
|
|
48
|
+
url: 'https://example.com/playlist.m3u8',
|
|
49
|
+
appId: 'xxx'
|
|
50
|
+
})
|
|
51
|
+
|
|
52
|
+
player.ready.then(() => player.play())
|
|
53
|
+
player.on('play', () => {})
|
|
54
|
+
player.destroy()
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
也支持容器 id 作为第一参数:
|
|
58
|
+
|
|
59
|
+
```js
|
|
60
|
+
const player = new HxPlayer('player-container-id', {
|
|
61
|
+
url: 'https://example.com/video.mp4'
|
|
62
|
+
})
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
`url` 与原先的 `sourceURL` 等价,两者都可传。
|
|
66
|
+
|
|
67
|
+
如果通过 `fileId` + `secret_id` 换地址,初始化是异步的,请使用 `player.ready`:
|
|
68
|
+
|
|
69
|
+
```js
|
|
70
|
+
const player = new HxPlayer({
|
|
71
|
+
id: 'player-container-id',
|
|
72
|
+
appId: 'xxx',
|
|
73
|
+
fileId: 'xxx',
|
|
74
|
+
secret_id: 'xxx',
|
|
75
|
+
timestamp: 0,
|
|
76
|
+
sign: 'xxx'
|
|
77
|
+
})
|
|
78
|
+
await player.ready
|
|
79
|
+
player.play()
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
### 直播
|
|
83
|
+
|
|
84
|
+
```js
|
|
85
|
+
const player = new HxPlayer({
|
|
86
|
+
id: 'live-container-id',
|
|
87
|
+
mode: 'live',
|
|
88
|
+
whepUrl: 'https://example.com/whep'
|
|
89
|
+
})
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
也可传 `protocol: 'webrtc'`、`mediaStream`、`getStream`、`signaling`。
|
|
93
|
+
|
|
94
|
+
### UMD
|
|
95
|
+
|
|
96
|
+
```html
|
|
97
|
+
<script src="./dist/hx-player.umd.js"></script>
|
|
98
|
+
<script>
|
|
99
|
+
const player = new HxPlayer({
|
|
100
|
+
id: 'player-container-id',
|
|
101
|
+
url: 'https://example.com/playlist.m3u8'
|
|
102
|
+
})
|
|
103
|
+
</script>
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
## 常用方法
|
|
107
|
+
|
|
108
|
+
| 方法 | 说明 |
|
|
109
|
+
| --- | --- |
|
|
110
|
+
| `play()` / `pause()` | 播放 / 暂停 |
|
|
111
|
+
| `seek(time)` | 跳转秒 |
|
|
112
|
+
| `currentTimeSec()` / `duration()` | 当前时间 / 总时长 |
|
|
113
|
+
| `changeSrc(url)` | 切换片源 |
|
|
114
|
+
| `muted(true\|false)` | 静音 |
|
|
115
|
+
| `setPlaybackRate(rate)` | 倍速 |
|
|
116
|
+
| `switchLine(line)` | 切换线路 |
|
|
117
|
+
| `on(name, cb)` / `off(name, cb)` | 事件 |
|
|
118
|
+
| `destroy()` | 销毁 |
|
|
119
|
+
|
|
120
|
+
## 目录
|
|
121
|
+
|
|
122
|
+
```
|
|
123
|
+
src/
|
|
124
|
+
index.js HxPlayer 入口
|
|
125
|
+
videoPlayer/ 点播(HLS / FLV / MP4)
|
|
126
|
+
livePlayer/ 直播(WebRTC)
|
|
127
|
+
logs/ 日志
|
|
128
|
+
utils/ 工具
|
|
129
|
+
```
|