去掉缓存

src/views/attend-class/component/audio-pay.tsx

@@ -56,8 +56,8 @@ export default defineComponent({
     const canvas: any = ref();
     const audio: any = ref();
     let vudio: any = null;
-    const audioSlider =
-      'audioSlider' + Date.now() + Math.floor(Math.random() * 100);
+    // const audioSlider =
+    //   'audioSlider' + Date.now() + Math.floor(Math.random() * 100);
 
     // 切换音频播放
     const onToggleAudio = (e?: any) => {
@@ -230,7 +230,7 @@ export default defineComponent({
         const currentTime = Date.now();
         const buffered = element.buffered;
         let currentBytesLoaded = 0;
-        let currentLength = 0;
+        const currentLength = 0;
 
         // 计算视频已缓存的总时长
         let cachedDuration = 0;
@@ -243,14 +243,14 @@ export default defineComponent({
               [buffered.start(i), buffered.end(i)]
             ]);
           }
-          for (let i = 0; i < buffered.length; i++) {
-            // 寻找当前时间之后最近的点
-            if (buffered.start(buffered.length - 1 - i) < element.currentTime) {
-              currentLength =
-                (buffered.end(buffered.length - 1 - i) / duration) * 100;
-              break;
-            }
-          }
+          // for (let i = 0; i < buffered.length; i++) {
+          //   // 寻找当前时间之后最近的点
+          //   if (buffered.start(buffered.length - 1 - i) < element.currentTime) {
+          //     currentLength =
+          //       (buffered.end(buffered.length - 1 - i) / duration) * 100;
+          //     break;
+          //   }
+          // }
           currentBytesLoaded *= element.duration * element.seekable.end(0); // 更精确地近似字节加载量
         }
 
@@ -262,28 +262,28 @@ export default defineComponent({
             uncachedTime = false;
           }
         });
-        if (duration) {
-          const sliderDom: any = document.querySelector(
-            '#' + audioSlider + ' .n-slider'
-          );
-          if (sliderDom) {
-            sliderDom.style.setProperty(
-              '--catch-width',
-              uncachedDuration > 0 ? `${currentLength}%` : 'calc(100% + 17px)'
-            );
-          }
-          console.log(
-            uncachedTime,
-            duration,
-            cachedDuration,
-            'duration',
-            buffterCatchArray,
-            element.currentTime,
-            currentLength + '%',
-            isWaiting,
-            currentBytesLoaded <= previousBytesLoaded
-          );
-        }
+        // if (duration) {
+        //   const sliderDom: any = document.querySelector(
+        //     '#' + audioSlider + ' .n-slider'
+        //   );
+        //   if (sliderDom) {
+        //     sliderDom.style.setProperty(
+        //       '--catch-width',
+        //       uncachedDuration > 0 ? `${currentLength}%` : 'calc(100% + 17px)'
+        //     );
+        //   }
+        // }
+        console.log(
+          uncachedTime,
+          duration,
+          cachedDuration,
+          'duration',
+          buffterCatchArray,
+          element.currentTime,
+          currentLength + '%',
+          isWaiting,
+          currentBytesLoaded <= previousBytesLoaded
+        );
 
         const isNoBuffer = currentBytesLoaded <= previousBytesLoaded;
         // console.log(
@@ -495,7 +495,7 @@ export default defineComponent({
             e.stopPropagation();
             emit('reset');
           }}>
-          <div class={styles.slider} id={audioSlider}>
+          <div class={styles.slider}>
             <NSlider
               value={audioForms.currentTimeNum}
               step={0.01}

src/views/attend-class/component/video-play.tsx

@@ -75,8 +75,8 @@ export default defineComponent({
     const videoRef = ref();
     const videoItem = ref();
     const videoID = ref('video' + Date.now() + Math.floor(Math.random() * 100));
-    const videoSlider =
-      'videoSlider' + Date.now() + Math.floor(Math.random() * 100);
+    // const videoSlider =
+    //   'videoSlider' + Date.now() + Math.floor(Math.random() * 100);
 
     // 对时间进行格式化
     const timeFormat = (num: number) => {
@@ -298,7 +298,7 @@ export default defineComponent({
         const currentTime = Date.now();
         const buffered = element.buffered;
         let currentBytesLoaded = 0;
-        let currentLength = 0;
+        const currentLength = 0;
 
         // 计算视频已缓存的总时长
         let cachedDuration = 0;
@@ -312,15 +312,15 @@ export default defineComponent({
               [buffered.start(i), buffered.end(i)]
             ]);
           }
-          for (let i = 0; i < buffered.length; i++) {
-            // 寻找当前时间之后最近的点
-            if (buffered.start(buffered.length - 1 - i) < element.currentTime) {
-              cachedDuration += buffered.end(i) - buffered.start(i);
-              currentLength =
-                (buffered.end(buffered.length - 1 - i) / duration) * 100;
-              break;
-            }
-          }
+          // for (let i = 0; i < buffered.length; i++) {
+          //   // 寻找当前时间之后最近的点
+          //   if (buffered.start(buffered.length - 1 - i) < element.currentTime) {
+          //     cachedDuration += buffered.end(i) - buffered.start(i);
+          //     currentLength =
+          //       (buffered.end(buffered.length - 1 - i) / duration) * 100;
+          //     break;
+          //   }
+          // }
           currentBytesLoaded *= element.duration * element.seekable.end(0); // 更精确地近似字节加载量
         }
 
@@ -333,29 +333,29 @@ export default defineComponent({
           }
         });
 
-        if (duration) {
-          const sliderDom: any = document.querySelector(
-            '#' + videoSlider + ' .n-slider'
-          );
-          if (sliderDom) {
-            sliderDom.style.setProperty(
-              '--catch-width',
-              uncachedDuration > 0 ? `${currentLength}%` : 'calc(100% + 17px)'
-            );
-          }
-
-          console.log(
-            uncachedTime,
-            duration,
-            cachedDuration,
-            'duration',
-            buffterCatchArray,
-            element.currentTime,
-            currentLength + '%',
-            isWaiting,
-            currentBytesLoaded <= previousBytesLoaded
-          );
-        }
+        // if (duration) {
+        //   const sliderDom: any = document.querySelector(
+        //     '#' + videoSlider + ' .n-slider'
+        //   );
+        //   if (sliderDom) {
+        //     sliderDom.style.setProperty(
+        //       '--catch-width',
+        //       uncachedDuration > 0 ? `${currentLength}%` : 'calc(100% + 17px)'
+        //     );
+        //   }
+
+        // }
+        console.log(
+          uncachedTime,
+          duration,
+          cachedDuration,
+          'duration',
+          buffterCatchArray,
+          element.currentTime,
+          currentLength + '%',
+          isWaiting,
+          currentBytesLoaded <= previousBytesLoaded
+        );
 
         const isNoBuffer = currentBytesLoaded <= previousBytesLoaded;
         // 如果存在未缓存的时间段，可以根据具体情况做出相应处理
@@ -578,7 +578,7 @@ export default defineComponent({
             emit('close');
             emit('reset');
           }}>
-          <div class={styles.slider} id={videoSlider}>
+          <div class={styles.slider}>
             <NSlider
               value={videoFroms.currentTimeNum}
               step={0.01}