需求：页面嵌入一个实时视频监控。如下：

页面监控样式.png

上述监控是可以点开播放的。
如何实现呢？首先要成为开发者，并创建一个应用，这些公司应该为你弄好了：

一、使用iframe内联框架

vue页面中嵌入h5内联框架。

iframe内联框架.png

二、在该内联框架中嵌入下述代码。（样式自调，注意看body中video的src，下面有替换步骤）

【标注一】该HTML内的代码：

<!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></title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        html,
        body {
            width: 100%;
            height: 100%;
        }
        
        video {
            width: 100%;
            height: 100%;
            vertical-align: top;
        }
    </style>
    <script src="../../js/ezuikit.js"></script>
    <script src="../../js/jquery.min.js"></script>
</head>

<body>
    <video id="hVideo" src="你的设备src地址" width="100%" height="100%" poster="" autoplay controls playsInline webkit-playsinline>
    </video>
    <script>
        // 开始初始化直播源地址
        var player = new EZUIKit.EZUIPlayer('hVideo');
        // 播放
        player.play();
        // 结束
        // player.stop();
    </script>
</body>

</html>