Live snapshots.
Summary: This article shows how to include a single snapshot from an Axis
network camera
on a web page.
The information in this article applies to
all Axis network cameras and video servers.
Description
Some browsers handle image caching
differently than they would a text or html page. They cache
images regardless if they have changed on the server or not.
Since the Axis network camera always provides live updated
images, you may on some browsers see an old cached image
when you return to the page. The following example shows how
to avoid this by using a dummy CGI parameter. The html page
example also includes a meta tag that will automatically
reload the html page every 30 seconds.
Example
<html>
<head>
<META http-equiv="Refresh" content="30">
<!-- The Meta tag above makes this page refresh every 30 seconds
-->
<!-- Change the number 30 into your desired refresh rate or
remove this -->
<!-- Tag if you do not want the page to refresh automatically
-->
<title>JPG Image Demo</title>
</head>
<body>
<center>
<h2>JPEG image</h2>
<SCRIPT LANGUAGE="JavaScript">
// Set the BaseURL to the url of your camera
// Example: var BaseURL = "http://172.21.1.122/";
var BaseURL = "http://[myCamera]/";
// The two following lines need to be changed if an an AXIS
241S(A)/241Q(A)/240Q/243SA is used:
var Camera = ""; // If you use an AXIS
241S(A)/241Q(A)/240Q/243SA, comment away this line by inserting
"//"
// var Camera = "n"; // Change n to the Video source used in the
AXIS 241S(A)/241Q(A)/240Q/243SA and remove "//"
// Go to the camera used and remove the "//" in front of the
ImageResolution to be used.
// Note that only one can be enabled at a time.
// List of additional available resolutions is shown in the
product's configuration.
// AXIS 206/207/210/210A/211/211A/212 PTZ/216FD/221/225FD
// var ImageResolution = "320x240";var DisplayWidth = "320";var
DisplayHeight = "240";
// var ImageResolution = "640x480";var DisplayWidth = "640";var
DisplayHeight = "480";
// AXIS 213 PTZ/214 PTZ/231D(+)/232D(+)/240Q/241S(A)/241Q(A)/243SA
PAL
// var ImageResolution = "352x288";var DisplayWidth = "352";var
DisplayHeight = "288";
// var ImageResolution = "704x576";var DisplayWidth = "704";var
DisplayHeight = "576";
// AXIS 213 PTZ/214 PTZ/231D(+)/232D(+)/240Q/241S(A)/241Q(A)/243SA
NTSC
// var ImageResolution = "352x240";var DisplayWidth = "352";var
DisplayHeight = "240";
// var ImageResolution = "704x480";var DisplayWidth = "704";var
DisplayHeight = "480";
// No changes required below this point
var File = "axis-cgi/jpg/image.cgi?resolution=" +
ImageResolution;
if (Camera != "") {File += "&camera=" + Camera;}
theDate = new Date();
var output = "<IMG SRC=\"";
output += BaseURL;
output += File;
output += "&dummy=";
output += theDate.getTime().toString(10);
// The above dummy cgi-parameter enforce a bypass of the browser
image cache.
output += "\" HEIGHT=\"";
output += DisplayHeight;
output += "\" WIDTH=\"";
output += DisplayWidth;
output += "\" ALT=\"Live Image\">";
document.write(output);
</script>
</body>
</html> |
Note 1: For more options see the HTML examples in the
product's web interface (products running firmware version
4.xx).
Note 2: Do not cut and paste this
code directly into the Microsoft FrontPage program. First
copy it to Notepad to remove formatting and then copy under
the HTML tab in a new page in FrontPage.
Important: Axis does not take any responsibility for how these
configuration changes may affect your system. If the modification
fails or if you get other unexpected results, you may have to
restore the factory default settings as described in the User’s
Manual.
|
Axis specializes in professional network video and printing solutions