海康威视网络摄像头开发流程（六）-------- 测试RTMP播放协议的页面

1、新建demo-rtmp.html文件，代码如下：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
    <meta name="renderer" content="webkit">
    <title>RTMP播放协议</title>
    <style>
        body{margin:0;}
        #myPlayer{max-width: 1200px;width: 100%;}
    </style>
</head>
<script>
</script>
<body>
<script src="https://open.ys7.com/sdk/js/2.0/ezuikit.js"></script>

<video id="myPlayer" controls playsInline webkit-playsinline autoplay>
    <source src="rtmp://rtmp.open.ys7.com/openlive/f01018a141094b7fa138b9d0b856507b.hd" type="rtmp/flv" />
</video>

<script>
  var player = new EZuikit.EZUIPlayer('myPlayer');

   // 日志
   player.on('log', log);

   function log(str){
       var div = document.createElement('DIV');
       div.innerHTML = (new Date()).Format('yyyy-MM-dd hh:mm:ss.S') + JSON.stringify(str);
       document.body.appendChild(div);
   }


</script>
</body>
</html>

2、在PageController.java文件中添加如下代码：

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class PageController {

    @RequestMapping(value = "/rtmp")
    public String rtmp(){
        return "demo-rtmp";
    }

}

3、运行项目并测试。
在web浏览器中地址栏中输入 " localhost:8080/rtmp "。
在这里插入图片描述 (注意：本项目中使用rtmp协议，使用的不是本地js文件引入的方式，此文章是在海康威视网络摄像头开发流程（五）的基础上进行开发测试的。)

来源：CSDN

作者：手写的从前98

链接：https://blog.csdn.net/GaoXiR/article/details/104376182

标签

开发流程

rtmp协议

海康威视