鍍金池/ 問答/HTML5  PHP  HTML/ flv.js在真機上跑不起來

flv.js在真機上跑不起來

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
    <script>
        document.documentElement.style.fontSize = $(document.documentElement).width() / 7.5 + 'px';
        $(window).on('resize', function() {
            document.documentElement.style.fontSize = $(document.documentElement).width() / 7.5 + 'px';
        });
    </script>

    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        .video_layout {
            position: relative;
            background-color: #fff;
            z-index: 100;
            width: 100%;
            height: 4.22rem;
        }
        
        .video_layout .player-container {
            position: relative;
            display: inline-block;
            width: 100%;
            height: 100%;
        }
        
        .video_layout .player-container .player-box {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            overflow: hidden;
        }
        
        .player-container .player-box.wide {
            position: fixed;
            width: auto;
            height: auto;
        }
        
        .player-container .player-box video {
            background: #000;
            display: inline;
            object-fit: contain;
        }
    </style>
</head>

<body>

    <script src="https://cdn.bootcss.com/flv.js/1.4.0/flv.min.js"></script>

    <div class="video_layout">
        <div class="player-container">
            <div class="player-box">
                <video id="videoElement" width="100%" height="100%"></video>
            </div>
        </div>
    </div>




    <script>
        if (flvjs.isSupported()) {
            var videoElement = document.getElementById('videoElement');
            var flvPlayer = flvjs.createPlayer({
                type: 'mp4',
                width: "100%",
                url: "http://video.payplay.com.cn/5c843971c43c440a812b8905eed283b7/bb427b092f484808b393c91616775c64-73bba532dde4dae57193961d09a93699.mp4"
            });
            flvPlayer.attachMediaElement(videoElement);
            flvPlayer.load();
            flvPlayer.play();
        }
        $(document).on("click", function() {
            $(" .video_layout .player-container .player-box").addClass("wide")
        });
    </script>
</body>

</html>

在chrome 模擬器上可以跑起來 用真機 沒有畫面

回答
編輯回答
憶往昔

建議在flvjs.isSupported()后接個判斷 看看是否機器不支持

if(flvjs.isSupported()){
    //balabala
}else{
    alert("this phone is not support")
}
2017年8月18日 02:53