当前位置：网站首页>Browser plays RTSP video based on nodejs

Browser plays RTSP video based on nodejs

2022-06-30 12:19:00 【Wangxiaomin】

Browser play rtsp video , be based on nodeJs

1： install ffmpeg, And configure environment variables .

Download address ：http://ffmpeg.zeranoe.com/builds/ perhaps ：

Baidu cloud link ：https://pan.baidu.com/s/1PBt18BHFGpdr0lpoUp5cKw
Extraction code ：hx08

To configure ：

Copy file address , Back to the desktop , Right click My computer / This computer , Click on Advanced system setup , senior , Click on environment variable

Click on path

Set the path

win + r Input cmd

Input ffmpeg enter

success

2：npm install node-rtsp-stream ws

1

2

3

4

5

6

7

8

9

10

11

12

13

14

const Stream=require('node-rtsp-stream');

// Set up rtsp Video streaming

const rtsp_url='rtsp://admin:[email protected]:554/live/main'

const streams = new Stream({

    name: 'sockets',

    streamUrl: rtsp_urls,

    wsPort: 9998,

    ffmpegOptions: { // Options ffmpeg sign

      '-stats': '', // Use an empty string for options that do not have a required value

      '-r': 30, // The option with the required value specifies the value after the key <br>　　　　'-s':'1920*1080'

    }

  })

　node xx.js Start the service

3: html Page play video

jsmpeg/jsmpeg.min.js at master · phoboslab/jsmpeg · GitHub

<!DOCTYPE html>
<html>
<head>
    <title>JSMpeg Stream Client</title>
    <style type="text/css">

        *{
            padding: 0;
            margin: 0;
        }

        .container{
            margin: 0 auto;
        }

       canvas{
           background-color: aqua;
           display: block;
           margin: 10px 0;
       }

    </style>
    
</head>
<body>
    <div class="container">
        <canvas id="video-canvas" width="1366" height="750" style="width:980px;height:544px"></canvas>
    </div>
    
    <script type="text/javascript" src="./scripts/jsmpeg.js"></script>
    <script type="text/javascript">
        const width = document.body.clientWidth;
        const height = document.body.clientHeight;
        console.log(width,height)
        const canvas = document.getElementById('video-canvas');

        console.log(document.location.hostname)

        var urls = 'ws://localhost:9998';
        var players = new JSMpeg.Player(urls, {canvas: canvas});
    </script>
</body>
</html>

原网站

版权声明
本文为[Wangxiaomin]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/181/202206301154111260.html

边栏推荐

猜你喜欢

随机推荐