Streaming an IP Camera to a Web Browser using FFmpeg

Показать описание

In this video I stream an IP Camera to a web browser using ffmpeg. The video is served using nginx web browser set up on Ubuntu linux.

Please follow me!

Visit my Amazon Storefront!

Support my channel!

#ffmpeg

Рекомендации по теме

Комментарии

<!DOCTYPE html>
<html><head><title>Live Cam</title></head>

<body>

<video id="video" autoplay="true" controls="controls"></video>
<script>
if (Hls.isSupported()) {
var video =
var hls = new Hls();
// bind them together
hls.attachMedia(video);
hls.on(Hls.Events.MEDIA_ATTACHED, function () {
console.log("video and hls.js are now bound together !");

hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
console.log("manifest loaded, found " + data.levels.length + " quality level");
});
});
}
</script>

</body>
</html>

Rickmakes

For YEARS I have looked for a " STRAIGHT TO THE POINT VIDEO!!" You have no IDEA how much money I have spent, and here you have this simple webcam in webpage script!! You are a BLESSING SIR!!

dj

You have to add -hls_wrap 10 if you want it to overwrite the 10 .ts files that were created. For it to function as described in your video your output variable should be: OUTPUT_HLS="-hls_time 10 -hls_list_size 10 -start_number 1 -hls_wrap 10"

chrisvaillancourt

You just earned 1 subscriber here buddy.

jadetaboada

Thanks a lot for the video. You saved my day!

rifatislamrakesh

Great video. You just saved my by implementing something horrifying with this simple approach

teomandi

It would be cool to know how to configure nginx and run it all in Docker

AlexanderWaal

hey i have setup it already but my problem is with doing rtmp to rtmps
because i want to do live on the https when i test it on local server then its working but i want to on the live server

BunnyGamer-wclf

hi sir please help, in your video there is only 1 cctv, what if more than 1? to convert ffmpeg in bash?

GhostGTR

I currently have 4 Pi zeros using RTSP and sending to Shinobi (NVR) on a Pi 4 8gb. Saving on an SSD or 1TB. Kind of my home security system. I can also see each camera on VLC player and also on a project (can't remember the name) that let's me display all 4 streams on a monitor. What I really want is to have audio also. I'm using the Pi cameras on the Pi Zeros. If I setup USB microphones do you think I can use the the script portion to send it to the SSD and ignore the webpage stuff? I'll probably try at least one with the webpage but I'll also try the 4 with the NVR. Hopefully you;ll reply before I waste a lot of time trying. LOL. FYI all PC's are Raspberry Pi's wit Pi cameras and USB Pi microphones. You video is using Ubuntu linux but hopefully it will work on a Pi. Thanks in advance. This this works you will have saved me a ton of time and research!
CJ

cjlowe

Thank you Rick. I have subscribbed and liked. I have 3 cameras I want to stream to a page on my website, do you know how I would do this (3 cameras as opposed to 1) ? Also if I embed the 3 x videos in my web page will ffmeg be running 24/7 pulling a 3 streams form my cameras even if the browser's page isn't showing ? Thank you

ianthediver

i am using window 10, and install xampp, my question is --> i have my ip camera on the front of my apartment that i already made port forwarding on the router, with public static ip address, when i stay in my house, i can see the video of ip camera of my apartment via * VLC player * when i put rtsp url with the public static ip address of my apartment 's ip camera , however when i have tried to use the command of ffmpeg with the rtsp url with the public static ip address of the router of my apartment in order to create the m3u8 file from my ip camera, the ffmpeg command does not generate the m3u8 file, it causes frozen on the terminal, however when i go back to my apartment, and connect my computer to the same router that connect to ip camera, i can create the m3u8 file successfully with running ffmpeg command with local ip address and i can stream the video successfully as you have done, so my question is --> how i can create the m3u8 file with running the ffmpeg command with my public static ip of my apartment when i am in my house ?

pompom

nice tutorial, how to run multiple camera?

jodikurniawan

Hello Rick,
At your vídeo the RSTP vídeo is sent to the server, transcoded to HLS and forwarded to the webrowser. Do you know if It's possible to send the video from the camera direct to the webrowser, without passing through the server?

ThiagoMartinsdeSousa

I get the Webpage to come up but the stream.sh gives me the error.
Could not write header for output file #0 (incorrect codec parameters ?):
Permission denied Error initializing output stream 0:0 --

I copied and pasted and used the correct ip for the camera that I tested in ffplay and that worked.
any ideas? Thanks

cjlowe

+RickMakes - Hi I am needing some help if possible.

So I have an IP Camera connected to my DVR and that DVR is connected to my router and all that works correctly and I'm able to see it working from my phone but I'm wanting to also view it from my Web Browser on my Mac... problem is it asks about installing Activex which if not mistaken cannot directly be done on a Mac.
-
Cannot help in any way on what I need to do to be able to view my IP Camera through a browser without it asking for ActiveX.
-
Any help would be thankfully appreciated.

Tony_

For example, ie.--> i have one ip camera in front of my apartment in Kuala Lumpur , and i have the other one of ip camera in the house in Bangkok , i am in Bangkok, i follow your video tutorial and i successfully watch and stream of the Bangkok ip camera, but i also want to stream the Kuala Lumpur ip camera RTSP too, so the first step following your video tutorial, i need to run the ffmpeg command to create the index.m3u8 and .ts files, and i have the public ip address, RTSP of my ip camera in Kuala Lumpur, ** but when i am in Bangkok and i start running the ffmpeg command from RTSP of Kuala Lumpur apartment 's ip camera, the ffmpeg could run but it stop, and it does not generate the index.m3u8 and .ts files from RTSP that send from Kuala Lumpur ip camera, however when i am in Bangkok and i test running the RTSP url from the Kuala Lumpur ip camera in vlc player, i successfully could watch the streaming video, So regarding to your video tutorial.,

--> how can i stream the RTSP from ip camera that come from or send from other place or other state / country ?
or how to run the ffmpeg command that has RTSP that come from other state / country ?

pompom

Is there a way to stream over webRTC via the udp protocol using ffmpeg to ensure low latency ?

MrSpeedsterm

Question. The script runs but it does not write the ts files to the directory UNTIL I kill the script by doing ctrl c. Then all at once the ts files and the m3u8 file show up. Any help?
Thanks!

thejword

Any updates to this? Any more complete source code online anywhere? For managing starting stopping the streams etc.? Please contact me

thejword

Streaming an IP Camera to a Web Browser using FFmpeg

How to Stream Your IP Camera to YouTube – Step-by-Step Tutorial for Beginners (2022)

Stream an IP Camera to Websites and Social Media

How to Live Stream Your IP & HD-TVI Security Cameras with OBS! (Three Methods)

How to use OBS as an IP camera viewer

How to Live Stream your Security Camera to Youtube (Montavue)

Live Stream Any IP Camera to Computer Directly

How to Turn your $35 Wyze Cam into an HD IP Camera for Streaming!

How to Stream IP Cameras to YouTube Live

Live IP Camera Streaming to Website

Live Stream an Axis IP Camera to Youtube and Facebook with OBS Studio in Less Than 10 Minutes

How to Live Stream an Amcrest IP Camera to Youtube or Facebook for Free using Castr.io

Broadcasting IP Camera Video Stream on Website/YouTube via OBS Studio

Live stream your IP camera to YouTube(RTMP function)

How to Live Stream on YouTube with an IP PTZ Camera

Live Stream IP Camera To Youtube | English | Live Streaming | Tech Expert Guide|

Streaming an IP Camera to a Web Browser using FFmpeg

How to create a live YouTube stream with your IP cameras

Live Streaming on Facebook with IP Camera

Stream Low-Res MJPEG Stream from Amcrest IP Camera Directly to Web Browser

How to connect PTZ camera to the joystick controller and do the live streaming quickly ?

Streamline IP Camera Setup with CCTV Tester: Simplify Address Discovery

Embed An IP Camera Stream On Your Website In Under 5 Minutes (For FREE!) | Show IP Camera Stream

OLD - How to View an IP Camera Using a Web Browser

How to Live Stream IP Camera from your website? Publish IP camera and embed in your web page.