需求：頁(yè)面嵌入一個(gè)實(shí)時(shí)視頻監(jiān)控度帮。如下：
頁(yè)面監(jiān)控樣式.png
上述監(jiān)控是可以點(diǎn)開(kāi)播放的歼捏。
如何實(shí)現(xiàn)呢？首先要成為開(kāi)發(fā)者笨篷，并創(chuàng)建一個(gè)應(yīng)用瞳秽，這些公司應(yīng)該為你弄好了：
一、使用iframe內(nèi)聯(lián)框架
vue頁(yè)面中嵌入h5內(nèi)聯(lián)框架冕屯。
iframe內(nèi)聯(lián)框架.png
二寂诱、在該內(nèi)聯(lián)框架中嵌入下述代碼。（樣式自調(diào)安聘，注意看body中video的src痰洒，下面有替換步驟）
【標(biāo)注一】該HTML內(nèi)的代碼：
<!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="你的設(shè)備src地址" width="100%" height="100%" poster="" autoplay controls playsInline webkit-playsinline>
</video>
<script>
// 開(kāi)始初始化直播源地址
var player = new EZUIKit.EZUIPlayer('hVideo');
// 播放
player.play();
// 結(jié)束
// player.stop();
</script>
</body>
</html>
三瓢棒、打開(kāi)https://open.ys7.com網(wǎng)址，按下述順序點(diǎn)擊查看直播地址丘喻。此時(shí)公司應(yīng)該給你賬號(hào)登錄了脯宿，你現(xiàn)在是開(kāi)發(fā)者的身份。
按順序點(diǎn)擊.png
按順序點(diǎn)擊進(jìn)來(lái)之后泉粉，復(fù)制一個(gè)視頻地址连霉，貼到【標(biāo)注一】的src中
復(fù)制地址.png
四、光貼src還不行嗡靡，必須引入h5中的js
需要注意的是跺撼，仔細(xì)看h5，該頁(yè)面需要引入兩個(gè)js文件：
要引入的js文件.png
五讨彼、下載js文件
下載地址：
【uikit下載地址：】https://open.ys7.com/doc/zh/uikit/uikit_javascript.html
image.png
下載uikit.js
【jquery-min下載地址：】https://www.bootcdn.cn/jquery
下載jquery-min.png
下載好之后歉井，導(dǎo)入進(jìn)你的項(xiàng)目，在該頁(yè)面引用哈误。
