1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title></title>
- <script src="./js/jquery.min.js"></script>
- <script src="./js/flv.min.js"></script>
- </head>
- <body>
- <video id="VideoRealPlay" autoplay muted controls></video>
- <button id="closeBtn">关闭</button>
- <script>
- var webSocket, flvPlayer;
- var _uUid = _uuid(), _uUids = _uuid();
- $(document).ready(function() {
- setMsg();
- startSocket();
-
- })
- // 安全帽
- function setMsg() {
- if ('WebSocket' in window) {
- webSocket = new WebSocket("ws://39.98.35.167:9988/video");
- } else if ('MozWebSocket' in window) {
- webSocket = MozWebSocket("ws://39.98.35.167:9988/video");
- } else {
- window.alert("浏览器不支持WebSocket");
- }
- webSocket.onopen = function() {
- setAlive()
- }
- webSocket.onclose = function() {
- console.log("我自闭了");
- }
- webSocket.onmessage = function(msg) {
- let _data = JSON.parse(msg.data);
- }
- }
- function setAlive(){
- webSocket.send(JSON.stringify({
- cmd: "keep_alive",
- sid: "52b2015f0f2c8ff7387a70da6674a310"
- }))
- setTimeout(setAlive, 3*1e4)
- }
- function _uuid() {
- let t = () => (65536 * (1 + Math.random()) | 0).toString(16).substring(1);
- return t() + t() + t() + t() + t() + t() + t() + t()
- }
- $("#closeBtn").on("click","",function(){
- webSocket.send(JSON.stringify({
- carId: "3668",
- channel: 1,
- cmd: "real_close",
- stream: 1,
- uuid: "fb6efcc4bba0386522cc03d42ec3885d"
- }))
- flvPlayer.unload();
- flvPlayer.detachMediaElement();
- flvPlayer.destroy();
- })
- function startSocket() {
- try {
- let videoWin = document.getElementById("VideoRealPlay");
- if (flvjs.isSupported()) {
- let websocketName = "ws://39.98.35.167:9988/real_play/52b2015f0f2c8ff7387a70da6674a310/gzyz/fb6efcc4bba0386522cc03d42ec3885d/P/0/2/1";
- flvPlayer = flvjs.createPlayer({
- type: "flv",
- //是否是实时流
- isLive: true,
- //是否有音频
- hasAudio: false,
- url: websocketName,
- enableStashBuffer: true,
- }, {
- enableStashBuffer: false,
- stashInitialSize: 128,
- });
- flvPlayer.on("error", (err) => {
- console.log("err", err);
- });
- flvjs.getFeatureList();
- flvPlayer.attachMediaElement(videoWin);
- flvPlayer.load();
- flvPlayer.play();
- return true;
- }
- } catch (error) {
- console.log("连接websocket异常", error);
- return false;
- }
- }
- </script>
- </body>
- </html>
|