0تضمين دفق RTSP مباشر في صفحة ويب

كنت أعمل مؤخرًا على إعداد المنزل الذكي وأحد الأشياء التي كنت أقصد إعدادها هو جهاز لوحي مزود بواجهة ويب تعمل باللمس لإدارة منزلي الذكي. كانت إحدى المشاكل الأولى التي واجهتني هي كيفية بث موجز cctv إلى متصفح الويب ...

المشكلة

My CCTV cam­era, مثل الكثير, يوفر فقط دفق RTSP. No mod­ern web browsers sup­port RTSP.

البحث والمتطلبات

Google just isn’t what it used to be and it took sev­er­al days of search­ing to find an accept­able solu­tion that met all of my require­ments…

• I wanted some­thing that would work entirely off­line without any third party serv­ers involved.
• I wanted some­thing that was com­pletely leg­ally free, مصدر مفتوح بشكل مثالي
• I wanted some­thing that would­n’t transcode the video or audio as this would waste pro­cessing resources

الحل

لقد وجدت really use­ful guide which explained a way to do this with a bit of JavaS­cript and ffm­peg, both of which were read­ily avail­able for free.

To run ffm­peg I used the fol­low­ing com­mand, which I ran on win­dows as a ser­vice, cre­ated with nssm…
ffmpeg -i rtsp://your_rtsp_ip:port/path/to/file.stream -c:v copy -c:a copy -bufsize 1835k -pix_fmt yuv420p -flags -global_header -hls_time 10 -hls_list_size 6 -hls_wrap 10 -start_number 1 /var/www/html/video.m3u8

To embed the video I down­loaded the fol­low­ing css file and 2 شبيبة الملفات

• HTTPS://vjs.zencdn.net/7.2.3/video-js.css
• HTTPS://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.14.1/videojs-contrib-hls.js
• HTTPS://vjs.zencdn.net/7.2.3/video.js

ثم استخدمت الرمز من الدليل (with mod­i­fied paths to loc­al files) لتضمين الفيديو الذي يعمل على الفور. ffm­peg is using around 0.2% cpu usage and a few mb of memory on the serv­er that hosts the web­site.

ملاحظة أخيرة, incase it mat­ters — I used the win64 stat­ic build of ffm­peg 4.2.2

أعتقد أننا فاتنا شيء? دعنا نعلم بتعليقك بالأسفل. إذا كنت ترغب في الاشتراك يرجى استخدام الرابط الاشتراك في القائمة في اعلى اليمين. يمكنك أيضا مشاركة هذا مع أصدقائك باستخدام الروابط الاجتماعية أدناه. في صحتك.