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

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

المشكلة

الكاميرا الخاصة بي CCTV, مثل الكثير, يوفر فقط دفق RTSP. لا يوجد متصفحات ويب حديثة تدعم 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 requirements…

• كنت أرغب في عمل شيء غير متصل تمامًا دون الحاجة إلى خوادم جهات خارجية.
• أردت شيئًا خاليًا تمامًا من الناحية القانونية, مصدر مفتوح بشكل مثالي
• أردت شيئًا لا يعمل على تحويل الفيديو أو الصوت لأن هذا من شأنه أن يهدر موارد المعالجة

الحل

لقد وجدت دليل مفيد حقا الذي شرح طريقة للقيام بذلك مع القليل من JavaScript و ffmpeg, كلاهما متاحان مجانًا.

لتشغيل ffmpeg استخدمت الأمر التالي, التي قمت بتشغيلها على النوافذ كخدمة, تم إنشاؤها باستخدام 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

لتضمين الفيديو قمت بتنزيل ملف css التالي و 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

ثم استخدمت الرمز من الدليل (مع مسارات معدلة للملفات المحلية) لتضمين الفيديو الذي يعمل على الفور. يستخدم ffmpeg حولها 0.2% cpu usage and a few mb of memory on the serv­er that hosts the website.

ملاحظة أخيرة, في حالة ما يهم - كنت بناء ثابت win64 من ffmpeg 4.2.2

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