vue-video-player播放m3u8报错

Question

<template>
    <div>
        <van-nav-bar
                left-text="返回"
                left-arrow
                @click-left="onClickLeft"
        />
        <video-player  class="video-player-box vjs-custom-skin"
                       ref="videoPlayer"
                       :options="playerOptions"
                       :playsinline="true"
                       >
        </video-player>
<!--        <div id="id_test_video" style="width:100%; height:auto;"></div>-->
        <van-tabs v-model="active">
            <van-tab :title="item.name" v-for="item in videoList" :key="item.src"></van-tab>
        </van-tabs>
    </div>
</template>

<script>
    // require styles
    import 'video.js/dist/video-js.css'
    import {videoPlayer} from 'vue-video-player';
    //在main.js内引入
    import 'videojs-contrib-hls'

    export default {
        name: "liveTelevisionShow.vue",
        data() {
            return {
                active:'',
                videoList:[],
                playerOptions: {
                    // videojs options
                    autoplay:true,
                    muted: false,
                    language: 'zh-CN',
                    fluid: true,
                    // playbackRates: [0.7, 1.0, 1.5, 2.0],
                    sources: [{
                        type: 'application/x-mpegURL',
                        src: "http://192.168.0.98:10002/5594cc9a1742464eaefafcf0e27a0350/index.m3u8"  //需要main.js下的videojs-contrib-hls才能使用
                    }],
                    notSupportedMessage: '此视频暂无法播放，请稍后再试',
                    controlBar: {
                        timeDivider: false,
                        durationDisplay: false
                    },
                    flash: { hls: { withCredentials: false }},
                    html5: { hls: { withCredentials: false }},
                    poster: "/static/images/author.jpg",
                },
            }
        },
        components: {
            videoPlayer
        },
        computed: {
            player() {
                return this.$refs.videoPlayer.player
            }
        },
        methods: {
            onClickLeft() {
                this.$router.history.go(-1);
            },
        },
        mounted() {

            // var player = new TcPlayer('id_test_video', {
            //     //"m3u8": "http://192.168.0.98:10002/5594cc9a1742464eaefafcf0e27a0350/index.m3u8", //请替换成实际可用的播放地址
            //     "m3u8": "https://iptv.bskeji.com/5594cc9a1742464eaefafcf0e27a0350/index.m3u8",
            //     "autoplay" : true,      //iOS 下 safari 浏览器，以及大部分移动端浏览器是不开放视频自动播放这个能力的
            //     "height" : '320'//视频的显示高度，请尽量使用视频分辨率高度
            // });
        }
    }
</script>

<style type="text/css">

</style>

我是用腾讯的TcPlayer可以播放，，但是我用vue-video-player播放iptv的m3u8一直报错

Answer 1

那你这多半是因为iptv没有返回给你文件，你是是直接拷的源不是按照他们的接入方式接入的吧

Answer 2

我也遇到了这个问题 请求您是怎么解决的