删除苹果手机的liveVideo

src/components/live/LiveVideo.vue

@@ -1,7 +1,7 @@
 <template>
   <div @click="emitClickVideo">
     <component
-      :is="!isAppleTerminal() ? LiveVideo : LiveVideoOS"
+      :is="LiveVideo"
       :url="props.url"
       v-if="props.url"
       :poster="props.poster"
@@ -9,14 +9,12 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { isAppleTerminal } from '@/utils/is';
   import { defineAsyncComponent } from 'vue';
 
   const props = defineProps<{ url: string; poster?: string }>();
   const emit = defineEmits(['clickVideo']);
 
   const LiveVideo = defineAsyncComponent(() => import('@/components/live/LiveVideoFlv.vue'));
-  const LiveVideoOS = defineAsyncComponent(() => import('@/components/live/LiveVideoHLSApple.vue'));
 
   // 点击视频时隐藏header和导航按钮
   function emitClickVideo() {

src/components/live/LiveVideoHLSApple.vue

@@ -1,146 +0,0 @@
-<template>
-  <video ref="videoRef" autoplay muted loop playsinline webkit-playsinline class="video-content"></video>
-</template>
-
-<script setup lang="ts">
-  import { onMounted, onBeforeUnmount, watch, ref } from 'vue';
-  import useGlobalStore from '@/stores/use-global-store';
-  import { storeToRefs } from 'pinia';
-  import Hls from 'hls.js';
-  import { showToast } from '@/utils/common';
-  import { useUserStore } from '@/stores/use-user';
-  import useAuthStore from '@/stores/useAuth';
-  import useCameraPlaybackStore from '@/stores/useCameraPlaybackStore';
-
-  const props = defineProps<{
-    url: string;
-  }>();
-
-  const userStore = useUserStore();
-  const { token } = storeToRefs(userStore);
-
-  const authStore = useAuthStore();
-  const { checkAuthValid } = authStore;
-
-  const stateStore = useGlobalStore();
-  const { liveLoaded } = storeToRefs(stateStore);
-
-  const cameraPlaybackStore = useCameraPlaybackStore();
-  const { isPlaybacking, isTouchDragging, isEnd } = storeToRefs(cameraPlaybackStore);
-  const { handlePlaybackVideoUpdateTime, getIsNearEnd } = cameraPlaybackStore;
-
-  const videoRef = ref<HTMLMediaElement | null>(null);
-
-  const handleTimeUpdate = (e) => {
-    if (!isPlaybacking.value || !liveLoaded.value || isTouchDragging.value) return;
-
-    handlePlaybackVideoUpdateTime(e.target.currentTime);
-  };
-
-  const handleLoadeddata = () => {
-    liveLoaded.value = true;
-    if (isTouchDragging.value) {
-      isTouchDragging.value = false;
-    }
-  };
-
-  const handleEnd = () => {
-    isEnd.value = true;
-    showToast({ message: '回看已结束', type: 'info' });
-  };
-
-  let hls: Hls;
-
-  const initPlay = () => {
-    console.log('现在是iphone的视频流播放组件');
-    console.log(props.url);
-
-    videoRef.value!.removeEventListener('loadeddata', handleLoadeddata);
-    videoRef.value!.addEventListener('loadeddata', handleLoadeddata);
-    videoRef.value!.removeEventListener('timeupdate', handleTimeUpdate);
-    videoRef.value!.addEventListener('timeupdate', handleTimeUpdate);
-    videoRef.value!.removeEventListener('ended', handleEnd);
-    videoRef.value!.addEventListener('ended', handleEnd);
-
-    if (!props.url) {
-      return;
-    }
-
-    if (!Hls.isSupported()) {
-      showToast({
-        message: '您的设备不支持视频流播放，请升级系统',
-        type: 'error',
-        offset: 100,
-      });
-      return;
-    }
-    // const videoElement = document.getElementById("video") as HTMLMediaElement;
-    hls = new Hls();
-    hls.loadSource(props.url + '?token=' + token.value);
-    hls.attachMedia(videoRef.value!);
-    hls.on(Hls.Events.MANIFEST_PARSED, () => {
-      const timer = setTimeout(() => {
-        liveLoaded.value = true;
-        videoRef.value!.play();
-        clearTimeout(timer);
-      }, 1000);
-    });
-    hls.on(Hls.Events.ERROR, (err, data) => {
-      console.error('iphone视频播放error');
-      console.error(err);
-      console.error(data);
-      checkAuthValid();
-      if (getIsNearEnd() && !isEnd.value) {
-        handleEnd();
-      }
-    });
-    hls.on(Hls.Events.BUFFER_EOS, () => {
-      console.log('流已经结束了');
-      handleEnd();
-    });
-  };
-
-  const destroyPlayer = () => {
-    liveLoaded.value = false;
-    isEnd.value = false;
-    if (hls) {
-      hls.destroy();
-    }
-  };
-
-  onMounted(() => {
-    initPlay();
-  });
-
-  //切换播放url
-  watch(
-    () => props.url,
-    () => {
-      destroyPlayer();
-      if (props.url) {
-        initPlay();
-      }
-    },
-    {
-      deep: true,
-    },
-  );
-
-  onBeforeUnmount(() => {
-    destroyPlayer();
-  });
-</script>
-
-<style scoped lang="less">
-  .video-content {
-    width: 100%;
-    height: 100%;
-    background-color: transparent !important;
-  }
-
-  .video-content::--webkit-media-controls-play-button {
-    display: none !important;
-    -webkit-appearance: none !important;
-  }
-</style>
-@/stores/use-global-store