integrated_traffic_uniapp/pages/application/onlinexxks/web_view_video.vue

<template>
  <view style="height: 250px"></view>
</template>

<script>
export default {
  props: {
    src: {
      type: String,
      required: true
    },
    poster: {
      type: String,
      default: ''
    },
    playTime: {
      type: Number,
      default: 0
    },
    isProgress: {
      type: Boolean,
      default: false
    },
  },
  data() {
    return {
      webview: null
    }
  },
  mounted() {
    this.createWebView()
  },
  beforeDestroy() {
    plus.webview.close('video')
    this.webview.removeEventListener('titleUpdate', this.handlePostMessage)
  },
  methods: {
    createWebView() {
      this.webview = plus.webview.create('/hybrid/html/video.html', 'video', {
        top: uni.getSystemInfoSync().statusBarHeight + 44 + 'px',
        height: '250px',
        videoFullscreen: "landscape"
      }, {
        src: this.src,
        poster: this.poster,
        playTime: this.playTime,
        isProgress: this.isProgress ? '1' : '0',
      });
      this.webview.show()
      this.webview.addEventListener('titleUpdate', this.handlePostMessage)
    },
    handlePostMessage(event) {
      const {eventName, currentTime} = JSON.parse(event.title)
      const eventNameKeys = ['ready', 'seeking', 'seeked', 'play', 'pause', 'ended', 'timeupdate']
      if (eventNameKeys.includes(eventName)) {
        this.$emit(eventName, currentTime)
      }
    },
    fn(event) {
      const eventKeys = ['play', 'pause', 'destroy', 'fullscreen.exit']
      if (eventKeys.includes(event)) {
        this.webview.evalJS(`htmlMessage('${event}')`);
      }
    }
  }
}
</script>

<style scoped>

</style>