1.下载webrtc-streamer
2.解压运行webrtc-streamer.exe
在欣赏器访问127.0.0.1:8000，点击窗口可以看到本机上各窗口及时状态，点击摄像头可以显示摄像头画面。
5.安装phpstudy，并建立网站。（详细过程本身网上搜）
6.打开网站根目录， 新建webrtc文件夹。将下载包html文件夹下webrtcstreamer.js文件和html/libs文件夹下adapter.min.js文件复制到webrtc文件夹下。
7.新建webrtc.html，并修改webrtc-streamer.exe所在IP（第27行），rtsp地址（第28行）
video组件加上muted才会主动播放，否则必要点击才能播放。
- <!DOCTYPE html>
- <html>
- <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>
- </head>
- <style>
- #id__stream {
- width: 100%;
- height: 100%;
- }
- </style>
- <body>
- <div>
- <video muted autoplay controls id="id__stream"></video>
- </div>
- <script src="./webrtcstreamer.js"></script>
- <script src="./adapter.min.js"></script>
- <script>
- // 只获取视频
- let constraints = {audio: false, video: true};
- let startBtn = document.getElementById('start')
- let stopBtn = document.getElementById('stop')
- let videoShowControl = document.getElementById('id__stream')
- const s = new WebRtcStreamer('id__stream', 'http://192.168.43.102:8000');
- s.connect('rtsp://admin:admin@192.168.43.110:554/stream0');
- startBtn.onclick = function () {
- }
- stopBtn.onclick = function () {
- videoShowControl.pause();
- }
- </script>
- </body>
- </html>
这里一共有三个地址：
webrtc-streamer.exe（html中配置）：http://192.168.43.102:8000
rtsp地址（html中配置）： rtsp://admin:admin@192.168.43.110:554/stream0
欣赏网址（phpstudy中配置）:http://192.168.43.102/webrtc/webrtc.html
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。 |
