How to stream a webcam to a web browser in Ubuntu

readme.md

Grr this took hours to figure out. I was trying to install MJPG-streamer and running VLC command lines and all this crap but nothing worked.

First install motion:

~> sudo apt-get install motion

Then create a config file:

~> mkdir ~/.motion
~> nano ~/.motion/motion.conf

In it, the bare minimum to run a web server and view it on other computers:

webcam_port 8081
webcam_localhost off

Then run motion:

~> motion

Now you can view the webcam at http://hostname:8081 If it doesn't work, try rebooting between steps or something.

Isn't that easy? >:(

See also: How to run webcam software only when I am not home

hey, my english is not very good but this is the configuration:
stream_quality 98
stream_maxrate 5
stream_port 8080
stream_localhost off
output_pictures off
framerate 30
ffmpeg_video_codec mpeg4
http://192.168.0.34:8080/ozzz1.cgi
width 320
height 240
auto_brightness off
contrast 0
saturation 0

http://192.168.0.34:8080/ozzz1.cgi <--------- replace with your local ip host webcam, cam ip, usb cam machine, etc. and after "/" with a name of your election for example in my case "ozzz1.cgi" . this works for me when i type in a browser on the other device that url: "http://192.168.0.34:8080/ozzz1.cgi " or in your case the url modified.

Just for everyone whos saying it wont work outside the network, port forward what you set this to (in this case 8081), then go to your wan ip :8081.

i.e. 619.169.691.619:8081

This solution was posted long time ago, but - THANK YOU!
Just as said, was breaking my head with vlc, ffmpeg, etc. but this solution is so simple and it is working.
Arch Linux amd64 and actually it is not working out of box with default conf, posted in readme.md , but it is working with @OzzzM solution:

hey, my english is not very good but this is the configuration:
stream_quality 98
stream_maxrate 5
stream_port 8080
stream_localhost off
output_pictures off
framerate 30
ffmpeg_video_codec mpeg4
http://192.168.0.34:8080/ozzz1.cgi
width 320
height 240
auto_brightness off
contrast 0
saturation 0

http://192.168.0.34:8080/ozzz1.cgi <--------- replace with your local ip host webcam, cam ip, usb cam machine, etc. and after "/" with a name of your election for example in my case "ozzz1.cgi" . this works for me when i type in a browser on the other device that url: "http://192.168.0.34:8080/ozzz1.cgi " or in your case the url modified.

Why do I writing this? Because @global-qa was ask is it possible over https. Yes, it is true he was ask this before two years, but just in case someone else need solution, I am using NGINX and below is my webcam.conf (I already have a domain name and ssl certificate, I am using port 8080, change server_name , ssl_certificate location , ssl_certificate_key location and proxy_pass , to fit your configuration)

`server { listen 80;
return 301 https://$host$request_uri;
}

server { server_name webcam.example.com;
listen 443 ssl;

    ssl_certificate /path/to/domain.cert.pem;
    ssl_certificate_key /path/to/private.key.pem;
    ssl_prefer_server_ciphers On;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers 'AES256+EECDH:AES256+EDH:!aNULL';
    resolver 8.8.8.8 8.8.4.4 valid=300s;
    resolver_timeout 5s;
    ssl_stapling_verify on;
    keepalive_timeout 180;
    add_header Strict-Transport-Security max-age=31536000 always;
    client_max_body_size 1024M;

    location / {
            # Send traffic to the backend
            proxy_pass http://127.0.0.1:8080;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-for $proxy_add_x_forwarded_for;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-Proto $remote_addr;
                        proxy_set_header X-Forwarded-Protocol $scheme;
            proxy_redirect off;

            # Send websocket data to the backend as
            # well
            proxy_http_version 1.1;
                        proxy_set_header Upgrade $http_upgrade;
                        proxy_set_header Connection "upgrade";
    }

}`

Awesome.. Good work.. Worked like a charm..!

hey, my english is not very good but this is the configuration:
stream_quality 98
stream_maxrate 5
stream_port 8080
stream_localhost off
output_pictures off
framerate 30
ffmpeg_video_codec mpeg4
http://192.168.0.34:8080/ozzz1.cgi
width 320
height 240
auto_brightness off
contrast 0
saturation 0

http://192.168.0.34:8080/ozzz1.cgi <--------- replace with your local ip host webcam, cam ip, usb cam machine, etc. and after "/" with a name of your election for example in my case "ozzz1.cgi" . this works for me when i type in a browser on the other device that url: "http://192.168.0.34:8080/ozzz1.cgi " or in your case the url modified.

Awesome! Works great with those options. I was also able to bind a webcam to ZoneAlarm server on other PC.

stream_port 8080
stream_localhost off

Yep!! Works, but now have other issues with VM passthrough of the USB device. Thats my issue, but your 'fix' appears to have got me a http server (but with no available device - same as a Windows VM).
But thanks, it has got me further.

Thank you so much.

I can't believe how incredibly easy this was.

My configuration file looks like this, just for reference.

stream_quality 98 stream_maxrate 5 stream_port 8080 stream_localhost off output_pictures off framerate 30 ffmpeg_video_codec mpeg width 640 height 480 auto_brightness off contrast 0 saturation 0

Hello. Is it normal that the stream is two color and mainly black. However the mkv files generated by motion are in full color. How to change the stream to be shown as it should?

@kpmkpm I don't know, sorry. It's color for me.

Hi @endolith, thanks for the post.
I am trying this on my ARM based iMX6Q board which has connected USB cam. I setup 'motion' as per the instructions mentioned above but failed to see the video.
Seems, I can see the streaming log but can't see the output video window while accessing it as 'http://..*.**:8080/' nothing gets open.

Please help. Thanks.

stream_port 8080
stream_localhost off

---

The settings above works for me! I am using ubuntu20.04 with headless Raspberry Pi4b

Hi @EVINK, thanks for your reply. I can see the stream log open at Board like this...

but when I try to see it using "http://xxx.xxx.x.xx:8080/", nothing gets open. Please suggest.

Anyone know how to make motion serve up single snapshots, on-demand, via URL? host:port/0/action/snapshot successfully results in generating the snapshot, saving it in /var/lib/motion, but it doesn't seem to actually serve up the resulting image (i.e. lastsnap.jpg) to the browser. This seems like a pretty basic feature, but I've searched a couple hours now and can't seem to find any evidence it is supported in motion.

but when I try to see it using "http://xxx.xxx.x.xx:8080/", nothing gets open. Please suggest.

Ash-S:
Hopefully you have figured this out by now, but in case and for others I've found the port sometimes needs a 'slash_1' added, so :8080/1. I have one Motion device with two cameras and it needs :8081/1 and the other just wants :8082.

as @EVINK said:

for motion's latest version for Ubuntu (Version 4.3.2), this is relevant configuration:

stream_port 8080
stream_localhost off

see more at: https://motion-project.github.io/motion_config.html

in addition, if you want to enable a web cam control:

webcontrol_port 8080
webcontrol_localhost off

also, configuring camera to its default resolution:

width 2560
height 1440

useful option, running in background

motion -b

all at ones for my camera:

stream_port 8081
stream_localhost off
webcontrol_port 8080
webcontrol_localhost off
width 2560 
height 144

stream_quality 98
stream_maxrate 5
stream_port 8080
stream_localhost off
output_pictures off
framerate 30
ffmpeg_video_codec mpeg4
http://192.168.0.34:8080/ozzz1.cgi
width 320
height 240
auto_brightness off
contrast 0
saturation 0

Thanks that works for me

helpful discussion. using new lubuntu 22.04LTS install, got local motion recording to work properly (after setting some chown directory issues). also can access live video in browser with localhost:8081 and localhost:8080. what I want to do is access the USB cam live video remotely. I know I'll need to find the IP address and somehow set a password, but no idea how to do either. any clues? thanks

if you don't want to video write files on the harddrive, you should switch the ffmpeg_output_moives off. i also increased the framerate to 10 (for watching my 3D printer), and increased the resolution, works with Ubuntu 22.04.1 LTS (Jammy Jellyfish):

stream_quality 98
stream_maxrate 10
stream_port 8080
stream_localhost off
output_pictures off
ffmpeg_output_movies off
framerate 30
ffmpeg_video_codec mpeg4
width 1024
height 768

How can I change to /dev/video1?

***@***.**** commented on this gist. ------------------------------------------------------------------------ How can I change to /dev/video1?

A couple of ways, which can be confusing.  The command line is "videodevice /dev/video1" (without the quotes).  If this is placed in motion.conf then it will affect all cameras attached to that Motion computer.  I prefer to place the command in camera1.conf (or whatever name is appropriate).  If you have one camera then either motion.conf or camera1.conf -- doesn't matter, but if multiple cameras then definitely in the camera/n/.conf. When using a camera/n/.conf you also need to uncomment the line in motion.conf.  (In my system it's in the last few lines.) Barry

After messing about with VLC, go2rtc, and webcamd for days, motion simply just works with MINIMAL fuss.

Here is my motion.conf file:

stream_quality 98
stream_maxrate 5
stream_port 1984
stream_localhost off
output_pictures off
framerate 30
ffmpeg_video_codec mpeg
width 640
height 480
auto_brightness off
contrast 0
saturation 0

Here is my NGINX server

server {
    server_name DOMAIN;
    root /var/www/html;

    auth_basic "Admin"; # password protected domain
    auth_basic_user_file /etc/apache2/.htpasswd;

    location / {
        proxy_pass http://127.0.0.1:1984/;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Prefix /;
    }


    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/DOMAIN/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/DOMAIN/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}