fix: abr 切换过程中卡帧

fixtures/flv/index.js

@@ -1,7 +1,7 @@
 import Player from '../../packages/xgplayer/src'
 import FlvPlayer from '../../packages/xgplayer-flv/src'
 
-localStorage.setItem('xgd', 1)
+// localStorage.setItem('xgd', 1)
 function defaultOpt() {
   return {
     isLive: true,
@@ -120,7 +120,7 @@ window.onload = function () {
       function pushEvent(name, value, container) {
         container = container || dlEvent
         if (container === dlEvent && dlLogPause.checked) return
-        console.debug('[test]', name, value)
+        // console.debug('[test]', name, value)
         if (container === dlEvent && logFilter && !logFilter(name, value)) {
           return
         }

packages/xgplayer-flv/src/flv/index.js

@@ -207,6 +207,18 @@ export class Flv extends EventEmitter {
 
     this._resetDisconnectCount()
 
+    if (this.loading && seamless) {
+      this._bufferService.seamlessLoadingSwitch = async (pts) => {
+        await this._clear()
+        this._bufferService.seamlessLoadingSwitching = true
+        this._urlSwitching = true
+        this._seamlessSwitching = true
+        this._bufferService.seamlessSwitch()
+        this._loadData(url)
+      }
+      return
+    }
+
     if (!seamless || !this._opts.isLive) {
       await this.load(url)
       this._urlSwitching = true

packages/xgplayer-flv/src/flv/services/buffer-service.js

@@ -126,13 +126,23 @@ export class BufferService {
 
     try {
       this.flv._transferCost.start(TRANSFER_EVENT.DEMUX)
-      demuxer.demuxAndFix(chunk, this._discontinuity, this._contiguous, this._demuxStartTime)
+      demuxer.demuxAndFix(chunk, this._discontinuity, this._contiguous, this._demuxStartTime, this.seamlessLoadingSwitching)
+      this.seamlessLoadingSwitching = false
       this.flv._transferCost.end(TRANSFER_EVENT.DEMUX)
     } catch (error) {
       throw new StreamingError(ERR.DEMUX, ERR.SUB_TYPES.FLV, error)
     }
     const { videoTrack, audioTrack, metadataTrack } = demuxer
 
+    if (this.seamlessLoadingSwitch) {
+      const idx = videoTrack.samples.findLastIndex(sample => (sample.originDts === videoTrack.lastKeyFrameDts))
+      if (idx >= 0) {
+        videoTrack.samples.splice(idx)
+        await this.seamlessLoadingSwitch()
+        this.seamlessLoadingSwitch = null
+      }
+    }
+
     let videoExist = videoTrack.exist()
     let audioExist = audioTrack.exist()
 

packages/xgplayer-transmuxer/src/flv/index.js

@@ -39,7 +39,7 @@ export class FlvDemuxer {
    * @param {boolean} [contiguous=true]
    * @returns {DemuxResult}
    */
-  demux (data, discontinuity = false, contiguous = true) {
+  demux (data, discontinuity = false, contiguous = true, seamlessLoadingSwitching) {
     const { audioTrack, videoTrack, metadataTrack } = this
 
     if (discontinuity || !contiguous) {
@@ -110,6 +110,7 @@ export class FlvDemuxer {
       if (tagType === 8) {
         this._parseAudio(bodyData, timestamp)
       } else if (tagType === 9) {
+        if (seamlessLoadingSwitching) this.seamlessLoadingSwitching = true
         this._parseVideo(bodyData, timestamp)
       } else if (tagType === 18) {
         this._parseScript(bodyData, timestamp)
@@ -169,8 +170,8 @@ export class FlvDemuxer {
    * @param {number} [startTime=0]
    * @returns {DemuxResult}
    */
-  demuxAndFix (data, discontinuity, contiguous, startTime) {
-    this.demux(data, discontinuity, contiguous)
+  demuxAndFix (data, discontinuity, contiguous, startTime, seamlessLoadingSwitching) {
+    this.demux(data, discontinuity, contiguous, seamlessLoadingSwitching)
     return this.fix(startTime, discontinuity, contiguous)
   }
 
@@ -305,8 +306,13 @@ export class FlvDemuxer {
 
       if (units && units.length) {
         const sample = new VideoSample(dts + cts, dts, units)
+        if (this.seamlessLoadingSwitching && dts < track.lastKeyFrameDts) {
+          return
+        }
+        this.seamlessLoadingSwitching = false
         if (frameType === 1) {
           sample.setToKeyframe()
+          track.lastKeyFrameDts = dts
         }
         track.samples.push(sample)
 

packages/xgplayer-transmuxer/src/model/video-track.js

@@ -62,6 +62,8 @@ export class VideoTrack {
 
   isVideo = true
 
+  lastKeyFrameDts = 0
+
   kid = null
 
   pssh = null