vue3.0 中使用video.js 打开立即播放 方案

谷歌浏览器禁止了video、audio标签的autoplay属性

谷歌的初衷不是禁止视频，而是禁止音频，但是视频中包含了音频信息，所以一并被禁止了

 

<template>

    <video ref="videoPlayer" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264"

        data-setup="{}">

        <source src="https://video.titansmart.cn/live/index2/1723701061.mp4" />

        <!-- <source src="https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8" type="video/mp4" /> -->

        <!-- 其他视频源 -->

    </video>

</template>

<script>

import videojs from 'video.js';

import 'video.js/dist/video-js.css';

export default {

    name: 'VideoPlayerComponent',

    mounted() {

        this.player = videojs(this.$refs.videoPlayer, this.options, function onPlayerReady() {

            console.log('Player is ready');

            this.muted(true);

            this.play()

        });

    },

    beforeUnmount() {

        if (this.player) {

            this.player.dispose();

        }

    }

};

</script>

<style>

/* 你的样式 */

</style>