반응형

package.json

{
  "name": "cctv",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.18.3",
    "node-rtsp-stream": "^0.0.9",
    "rtsp-ffmpeg": "^0.0.17",
    "socket.io": "^4.7.4",
    "ws": "^8.16.0"
  }
}

 

app.js

const Stream = require('node-rtsp-stream')
const stream = new Stream({
    name: 'name',
    streamUrl: 'rtsp://admin:hikvision!@192.168.3.65:554',//rtsp://210.99.70.120:1935/live/cctv001.stream, rtsp://admin:hikvision!@192.168.3.65:554
    //streamUrl: 'rtsp://210.99.70.120:1935/live/cctv001.stream',
    wsPort: 9999,
    ffmpegOptions: { // options ffmpeg flags
        '-stats': '', // an option with no neccessary value uses a blank string
        '-r': 30 // options with required values specify the value after the key
    }
})

const app = require('express')(),
  server = require('http').Server(app),
  io = require('socket.io')(server),
  rtsp = require('rtsp-ffmpeg');

server.listen(6148, () => { console.log('Server started on port 6148'); }); //열고싶은 포트번호 입력

//var uri = 'rtsp://210.99.70.120:1935/live/cctv001.stream'

// stream = new rtsp.FFMpeg({ input: uri });

// io.on('connection', function (socket) {
//   var pipeStream = function (data) {
//     socket.emit('data', data.toString('base64'));
//   };
//   stream.on('data', pipeStream);
//   socket.on('disconnect', function () {
//     stream.removeListener('data', pipeStream);
//   });
// });

console.log('__dirname',__dirname);
app.get('/', function (req, res) {
  res.sendFile(__dirname + '/test.html');
});

 

test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>

<canvas></canvas>

<script>
var client = new WebSocket('ws://localhost:9999');
var canvas = document.querySelector('canvas');
var player = new jsmpeg(client, {
    canvas: canvas
});
</script>
</body>
</html>

 

 

정영복N공유링크, 테스트 소스 있으나 이대로 했을 때 ffmpeg 실행에러가 떳음: https://siksik1117.tistory.com/10

  • npm install express
  • npm install  rtsp-ffmpeg: 검색해보니, 윈도우 환경에서는 node로 설치하면 안되고 별도의 ffmpeg를 받아야 한다고 함, 별도로 소스받고 환경변수 설정해서 해결했음
  • npm install socket.io: 뭔 때문인지 잘 안되었던 듯 결국 socket.io가 아니라 ws (web socket?)으로 성공했었던듯

 

 

express, ws  설치해서 사용하는 소스 나와있음, https://sir.kr/pg_tip/17552

 

NodeJS로 ffmpeg 사용하여 rtsp 데이터를 websocket 으로 방송하기 > SIR

1. 먼저, Node.js 프로젝트를 설정하고 필요한 패키지를 설치합니다. 예를 들어, `express`와 `ws` 패키지를 사용할 수 있습니다. <br/> <br/> <br/>2. Express를 사용하여 웹 서버를 설정하고 WebSocket 연결을 처

sir.kr

 

 

여러 solution을 찾아본 경험과 링크 정리, 실질적 소스는 없음 https://qodbtn.tistory.com/392

 

웹에서 IP 카메라 스트리밍 하기

카메라는 공유기 포트포워딩해서 RTSP로 접속해서 데이터를 가져오고 있는 상태찾아보면서 너무 오래된 답변이 많아서 고생했다. 목차- VLS 해보기- 이것저것 찾아보기- FFMPEG로 RTSP를 HLS로 변환

qodbtn.tistory.com

 

 

ffmpeg, node-rtsp-stream을 이용한 샘플코드 나와있음 (웹서버는 없고 index.html파일에서 rtsp url이 재생되는 page를 만들어내는 부분까지만) https://gps-homepage.tistory.com/12

 

RTSP 웹 스트리밍 개발 - 1 -

1. VMS(Video Management System)으로 부터 CCTV들의 RTSP를 받아 웹 브라우저에서 출력해야하는 임무를 받게 되었다.(왜 협력해주는 vms에서 rtsp만 지원해주는지는 몰?루) 2. 여러 시도와 폭풍 구글링 끝에

gps-homepage.tistory.com

 

 

VLC media player를 사용해서 rtsp재생하는 법, cctv직구해서 AP연결하는 법 https://monocsp.dev/12

 

4. 컴퓨터에서 공유기와 RTSP를 이용한 CCTV연결(VLC)

이전 포스팅에서 파이썬으로 파일 옮기기를 했었다. 이번에는 RTSP(Real Time Streaming Protocol)를 이용하여 영상을 받아오기로 하자. 외부에서 접근하면 더 좋게 만들 수 있겠지만, 나는 내부망으로 사

monocsp.dev

 

 

영어설명, 나름 소스도 있으나 안해봤음 https://dev.to/tejasvi2/rtsp-stream-to-web-browser-using-ffmpeg-1cb

 

RTSP stream to Web Browser using FFMPEG

If you need to stream your video from the webcam to your browser webpage. To achieve this I have trie...

dev.to

 

반응형
저작자표시

+ Recent posts

티스토리툴바