xgplayer
xgplayer copied to clipboard
手动切换URL的时候报错
您使用的西瓜播放器版本是多少? What version of xglayer are you using? xgplayer: 2.19.1 xgplayer-flv: 2.4.17
您使用的操作系统和浏览器分别是? What OS and browser are you using? chrome: 89 windows 10 20H2
如何复现问题? What did you do?
<template>
<div style="display: inline-block" id="flv-player-container"></div>
</template>
<script>
import 'xgplayer'
import FlvPlayer from 'xgplayer-flv'
export default {
name: 'FlvPlayer',
props: {
url: {
type: String,
required: true
},
poster: {
type: String
},
isLive: {
type: Boolean,
default: false
},
width: {
type: Number,
default: 640
},
height: {
type: Number,
default: 360
},
},
watch: {
url (newUrl) {
this.player && (this.player.src = newUrl)
}
},
mounted () {
this.player = new FlvPlayer({
width: this.width,
height: this.height,
id: 'flv-player-container',
// ignores: ['reload', 'play','replay', 'start'],
url: this.url,
poster: this.poster,
isLive: this.isLive,
preloadTime: 30,
minCachedTime: 5,
cors: true
})
this.player.on('error', (error) => {
console.error('FlvPlayer error', error)
this.player.reload()
})
},
methods: {
play () {
this.player.play()
},
pause() {
this.player && this.player.pause()
}
},
beforeDestroy () {
this.player && this.player.destroy()
}
}
</script>
<style lang="less">
//#flv-player-container {
// .xgplayer-enter, .xgplayer-start, .xgplayer-replay {
// display: none;
// }
//}
</style>
<template>
<div id="app">
<player is-live ref="player" :url="url"/>
<button @click="click">aaa</button>
</div>
</template>
<script>
import Player from './FlvPlayer'
export default {
name: 'App',
components: {
TrackBroadcastConfig,
Player,
Test
},
data () {
return {
url: ''
}
},
methods: {
click () {
this.url = '//sf1-hscdn-tos.pstatp.com/obj/media-fe/xgplayer_doc_video/flv/xgplayer-demo-720p.flv'
}
}
}
</script>
您期望的播放器正常行为是? What did you expect to happen?
1,能正常播放视频
2,如果使用你们 npm node_modules 里的 d.ts
声明文件里的 IPlayerOptions
配置的 ignores
选项,应该能隐藏相关按钮
实际播放器的表现是? What actually happened? 1,播放器不能正常播放,报错:
// stack trace
Uncaught (in promise) TypeError: Cannot read property 'resetContext' of undefined
at J.<anonymous> (index.min.js:1)
at ee (index.min.js:1)
at J../node_modules/xgplayer-flv/dist/index.min.js.J.emit (index.min.js:1)
at i.value (index.min.js:1)
at i.value (index.min.js:1)
at i.value (index.min.js:1)
at ee (index.min.js:1)
at J../node_modules/xgplayer-flv/dist/index.min.js.J.emit (index.min.js:1)
at i.value (index.min.js:1)
at i.value (index.min.js:1)
// code:
{
key: "initFlvBackupEvents",
value: function(e, t) {
var n = this
, r = 3;
e.on(xe.REMUX_EVENTS.MEDIA_SEGMENT, (function() {
0 === (r -= 1) && (n.flv = e,
n.mse.resetContext(t),
n.context.destroy(),
n.context = t,
n.paused && yi(i.prototype.__proto__ || Object.getPrototypeOf(i.prototype), "play", n).call(n))
}
)),
e.once(xe.LOADER_EVENTS.LOADER_COMPLETE, (function() {
if (n.paused)
n.emit("ended");
else if (n.video) {
var e = n.getBufferedRange()[1] - n.currentTime;
setTimeout((function() {
n.emit("ended")
}
), 1e3 * e)
}
}
)),
e.once(xe.LOADER_EVENTS.LOADER_ERROR, (function() {
t.destroy()
}
))
}
2,如果使用了 ignores
选项,页面乱了:
我也遇到同样的问题!解决了吗?
我也遇到同样的问题!解决了吗?
没有,现在只能手动销毁然后重新初始化
我也遇到同样的问题!解决了吗?
没有,现在只能手动销毁然后重新初始化
我通过 player.start(newUrl); player.src= newUrl; 可以切换
This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this will be closed in 30 days.
This issue has been automatically closed after a period of inactivity. If it is still present in the latest release, please create a new issue with up-to-date information. Thank you!