How to Embed CCTV Security Camera Video on a Website

Embed CCTV Camera Video in Webpage
Want to learn how to embed a live video stream from a security camera on your website? This article documents one way to do it using an analog CCTV camera and network video server. I documented this setup based on my recent experience with a prospective business customer.

Live CCTV Camera

Here is a live view of a security camera installed. This camera is embedded into this web page is using the same setup that I recommended to the customer that I spoke to. This website uses a responsive website design which means that the HTML used to embed the video works on desktop, tablet, and mobile web browsers and adjusts in size according to the screen size and resolution of the device. In plain English, the live video and all other elements of the page will look good on desktop and mobile browsers.

DVR Surveillance System with Website Video Embed

Security Camera DVR Embed Video Website

Here is a diagram of the of the system setup. I suggested that she replace her existing DVR with a 4 channel iDVR-PRO4A and that she add a Zavio V1100 network video server so that she can enable video streaming for one camera using HTML.

Here’s how it all works.

  1. All of her existing cameras (except camera #4, the one that will stream on the website) will connect to the the new DVR using the coax cable that is already in place. The iDVR-PRO uses standard BNC connectors so this will be a simple drop in replacement to her old DVR.
  2. Camera #4  will connect to the BNC video input of the Zavio V1100 using the existing RG59 coax cable that is in place.
  3. The V1100 has a BNC loop output will be connected to the video input of the DVR. I suggested that she place the video server on the same shelf as the DVR and use this RG59 jumper cable to connect it to the DVR.
  4. The V1100 video server will be connected to her network router using CAT-5 cable. Her network router and modem sit in the same closet as the DVR, so this is easy for her to connect as well.
  5. The tech support team at CCTV Camera Pros can help setup the port forwarding rules required to make the video from the server available over the Internet.
  6. We can provide instructions to her webmaster or we can assist with setting up the video embed code on her website. This page documents one way embed Zavio IP cameras and video servers into a  web page. It is done a little different above on this page because I wanted to make the video display responsive for desktop and mobile web browsers.
  7. The iDVR-PRO4A has a spot monitor output that can be used to display a single camera, scroll from camera to camera and / or display all 4 cameras on the screen at once. This public display monitor will be mounted inside the laundromat. More information about the iDVR-PRO spot monitor feature can found here and a demo video can be found here.
  8. The iDVR-PRO is also connected to her network router so that the two business owners can login to the DVR to view all cameras from Mac, Windows, iOS, and Android. Demo videos of the remote camera access can be found here.

Live Streaming Cameras for Business Websites

Besides sharing how a CCTV camera can be embedded on a website, I also wrote this article because I thought that the idea of using an “Internet webcam” specifically for a laundromat website was great. Besides laundromats, there are certainly a lot of other businesses that should think about installing a camera at their business to show online customers how busy they currently are.

Here are some other ideas for using a live camera on a businesses website.

  • Hotels and resorts can use cameras to show a live view of their property.
  • Night clubs can stream a live view of events or special areas of interest at their location.
  • Zoos and wildlife sanctuaries can provide a live view of animals.
  • Waterfront restaurants can show off thier oceanfront or lakefront views.
  • Ski resorts can show a live view of the slopes.
  • Golf courses can show a live view of one or more holes.

One last thing that I want to mention. Using a CCTV camera with a network video server or using IP cameras to stream live video on a website obviously has limitations. Besides the camera and server, the quality of the video your website visitors will experience is dependent on the Internet speed at the location of the camera. Specifically, the upload speed (which is usually slower that download speed from cable and DSL providers) is what your camera uses to stream video. Also, network video servers and IP cameras are usually limited to 10 simultaneous viewers or less. This means that depending on the specific camera or server you use, the webpage that you embed your video stream into will be limited to about 10 visitors at a time.

There are hosted video streaming options that charge a monthly fee that support unlimited users. They generally cost $300 a month or more which is not feasible for a small business. Using CCTV cameras or IP cameras provides an affordable low volume alternative with no monthly fees (besides the required high speed Internet connection).

 

*This article originally appeared in cctvcamerapro website.
https://videos.cctvcamerapros.com/live-cameras/embed-security-camera-video-on-website.html

1 Comment

  1. I think this is one of the most important information for me.

    And i’m glad reading your article. But wanna remark
    on some general things, The web site style is wonderful, the articles is really excellent : D.
    Good job, cheers

Leave a Reply

Your email address will not be published. Required fields are marked *