多个aliplayer实例时,播放器seek栈溢出 已解决

我用vue创建了一个div,然后以这个div box创建了一个aliplayer实例,一开始实例的source指定了artc:// 的直播流地址,然后点击按钮需要将地址切换成http://*.m3u8 录播地址:

在创建新的aliplayer实例的时候,都已经调用了dispose销毁原来的实例了:

this.player && this.player.dispose();
this,player = new Aliplayer({
  id: "videoContainer",
  source: this.source,
})

但是在播放m3u8视频的时候,在chrome、Edge、Android版微信上测试了都会报错: RangeError,追进去是seek一直在调自己本身。 网上查了下,别人好像也碰到多个实例产生的问题。

我尝试了 1. 创建新实例前,将Dom节点删除再重新添加; 2. https://www.alibabacloud.com/help/zh/apsaravideo-for-vod/latest/vod-web-advanced-functions#p-p9i-x1g-dwq 进阶功能中的: a. 不销毁,调loadByUrl尝试切换source, 报 NEED RELOAD INSTANCE的错误。 b. $(‘#J_prismPlayer’).empty(); c. dispose后加延时,再创建新实例 都没有用。 目前能解决的方式,是刷新页面,然后将新的url传参进来。

有没有其他好的解决方法?或者修复这个BUG?

「点点赞赏,手留余香」

    还没有人赞赏,快来当第一个赞赏的人吧!
=====这是一个广告位,招租中,联系qq 78315851====
1 条回复 A 作者 M 管理员
  1. 经过了多方的问题排除,最终确定了问题,vue的版本问题,我的项目使用的是vue2,网上的说法是: vue2用 new Vue(); vue3用createApp(); 多个实例时,vue2中的vue实例共享一个Vue构造函数,无法做到完全隔离。 如果改成vue3的话,就没有这个问题了。感谢!

  2. 可能是遇到了在切换m3u8视频源时实例重新创建的问题,并且尝试了多种解决方法,但都没有成功。以下是一些可能有用的解决方案:

    1、检查代码中是否有其他地方创建了新的实例。如果有,请尝试删除这些实例,或者在创建新实例之前先清除它们。

    2、检查是否已经尝试过使用不同的源地址。如果你已经尝试过使用不同的源地址,但仍然遇到问题,那么可能需要尝试使用不同的源地址或者更改源地址。

    3、尝试使用不同的播放器实例。如果你已经尝试过使用不同的实例,但仍然遇到问题,那么可能需要尝试使用不同的实例或者更改实例。

    4、尝试使用不同的m3u8文件。如果你已经尝试过使用不同的m3u8文件,但仍然遇到问题,那么可能需要尝试使用不同的m3u8文件或者更改m3u8文件。

    5、尝试使用不同的浏览器或设备。如果你已经尝试过使用不同的浏览器或设备,但仍然遇到问题,那么可能需要尝试使用不同的浏览器或设备或者更改浏览器或设备。