ios端使用TCplayer直播播放三秒直接卡顿bug

small_fox_dtt2025-03-22 18:11

查看配置项没问题

复制代码

 setTcPlayer() {
   let that = this;
   player = new TcPlayer("videoPlayer", {
     live: this.activatPlayType == "livePlay" ? true : false,
     x5_type: "h5",
     x5_fullscreen: true,
     systemFullscreen: true,
     x5_orientation: 1,
     x5_player: true,
     flash: false,
     webrtc: this.liveRTCSrc,
     m3u8: this.liveSrc, //请替换成实际可用的播放地址
     autoplay: false, //iOS 下 safari 浏览器，以及大部分移动端浏览器是不开放视频自动播放这个能力的
     width: that.fun.getPhoneEnv() != 3 ? window.innerWidth : "375", //视频的显示宽度，请尽量使用视频分辨率宽度
     height: this.liveHeight, //视频的显示高度，请尽量使用视频分辨率高度
     wording: {
       2032: "请求视频失败，请检查网络",
       2048: "请求m3u8文件失败，可能是网络错误或者跨域问题"
     },
     controls: "none",
     Flash: false,
     listener: function(msg) {
       // console.log(msg.type);
       if (msg.type == "loadeddata") {
         console.log("loadeddata===============");
         that.resizeH();
         // that.onPlayerPlay();
       }
       if (msg.type == "loadedmetadata") {
         // console.log("loadedmetadata==》》》》》",parseInt(player.video.el.duration));
         that.targetVideo.maxTime = parseInt(player.video.el.duration);
       }
       if (msg.type == "load") {
         timer_2 = setTimeout(() => {
           that.loadedVideoDataOk = true;
         }, 800);
       }
       if (msg.type == "error") {
         console.log("error::视频播放不了.....");
         Toast("该视频出现问题了！");
         that.show = true;
         that.loadedVideoDataOk = true;
         that.$set(that.liveList[that.activeSwiperIndex], "show", true);
       }
       if (msg.type == "play") {
         that.videoPlaying();
         clearInterval(timer_2);
       }
       if (msg.type == "playing") {
         that.songStop = false;
         that.isFirstPlay = true;
         // that.videoPlaying();
       }
       if (msg.type == "pause") {
         that.songStop = true;
       }
       if (msg.type == "timeupdate") {
         that.targetVideo.currentTime = player.video.el.currentTime;
         that.sliderTime = parseInt((that.targetVideo.currentTime / that.targetVideo.maxTime) * 100);
       }
     }
   });
 },

对比官方文档没发现什么问题

最后在代码里查看发现初始化两个palyer播放器；考虑ios直播流时间戳时间比较严格；两个同时初始化渲染；会出现此问题；注释掉另一个可以正常播放。