Commit db6fdab215c6c718476d9c83d5d737ef68fe73ec
Committed by
xp.Huang
1 parent
8bc2e91e
fix: 隐藏视频组件无视频流时界面提示
Showing
2 changed files
with
31 additions
and
10 deletions
| @@ -93,8 +93,9 @@ | @@ -93,8 +93,9 @@ | ||
| 93 | 93 | ||
| 94 | function onDecodeError() { | 94 | function onDecodeError() { |
| 95 | console.warn('player happend decode error'); | 95 | console.warn('player happend decode error'); |
| 96 | - playerRef.value?.destroy?.(); | ||
| 97 | - initializePlayer(); | 96 | + // playerRef.value?.destroy?.(); |
| 97 | + // initializePlayer(); | ||
| 98 | + playerRef.value?.switchURL(props.url!); | ||
| 98 | } | 99 | } |
| 99 | 100 | ||
| 100 | function initializePlayer() { | 101 | function initializePlayer() { |
| @@ -113,11 +114,31 @@ | @@ -113,11 +114,31 @@ | ||
| 113 | emits('ready', player); | 114 | emits('ready', player); |
| 114 | }); | 115 | }); |
| 115 | 116 | ||
| 116 | - player.on(Events.ERROR, (error: IError) => { | ||
| 117 | - // https://h5player.bytedance.com/api/error.html#type | ||
| 118 | - if (error.errorCode === 5103) { | ||
| 119 | - onDecodeError(); | ||
| 120 | - } | 117 | + player.setEventsMiddleware({ |
| 118 | + error: (event, callback) => { | ||
| 119 | + const code = ( | ||
| 120 | + event as unknown as { | ||
| 121 | + error: MediaError; | ||
| 122 | + } | ||
| 123 | + ).error.code; | ||
| 124 | + if (code === MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED) { | ||
| 125 | + if (!props.url) { | ||
| 126 | + return; | ||
| 127 | + } | ||
| 128 | + callback(); | ||
| 129 | + return; | ||
| 130 | + } | ||
| 131 | + | ||
| 132 | + if (code === MediaError.MEDIA_ERR_DECODE) { | ||
| 133 | + // 视频流可以播放 中途解码失败重载 | ||
| 134 | + if (playerRef.value?.isPlaying) { | ||
| 135 | + onDecodeError(); | ||
| 136 | + } | ||
| 137 | + return; | ||
| 138 | + } | ||
| 139 | + | ||
| 140 | + callback(); | ||
| 141 | + }, | ||
| 121 | }); | 142 | }); |
| 122 | 143 | ||
| 123 | player.on(Events.PAUSE, () => { | 144 | player.on(Events.PAUSE, () => { |
| @@ -293,9 +293,9 @@ | @@ -293,9 +293,9 @@ | ||
| 293 | height: 100%; | 293 | height: 100%; |
| 294 | } | 294 | } |
| 295 | 295 | ||
| 296 | - .split-screen-mode:deep(.ant-spin-container) { | ||
| 297 | - height: 100% !important; | ||
| 298 | - } | 296 | + // .split-screen-mode:deep(.ant-spin-container) { |
| 297 | + //height: 100% !important; | ||
| 298 | + // } | ||
| 299 | 299 | ||
| 300 | .video-container { | 300 | .video-container { |
| 301 | .video-container-mask { | 301 | .video-container-mask { |