Podgląd wideo na żywo na stronie o średniej oglądalności

Podsumowanie: W artykule tym opisano sposób umieszczania strumienia wideo z produktu sieciowego Axis na stronie internetowej.
Informacje zawarte w tym artykule mają zastosowanie do wszystkich kamer sieciowych i serwerów wideo Axis z oprogramowaniem sprzętowym w wersji od 4.xx.

Opis

Jeżeli kamerę sieciową Axis można podłączyć bezpośrednio do sieci Ethernet, wystarczy podłączyć kamerę do sieci, aby uzyskać podgląd rejestrowanych przez nią obrazów. Dzięki wbudowanemu serwerowi WWW nie trzeba wykonywać żadnych czynności. Można również w łatwy sposób skonfigurować własną stronę WWW produktu. Aby umieścić na stronie WWW podgląd na żywo, należy postępować zgodnie z przedstawionymi tutaj instrukcjami.
Kamery sieciowe Axis są w stanie obsłużyć maksymalnie 20 jednoczesnych połączeń; wystarcza to zazwyczaj na potrzeby stron o średnim ruchu. Kiedy liczba użytkowników jednocześnie oglądających obraz przekroczy 20, kolejny użytkownik nie będzie w stanie obejrzeć podglądu na żywo.
Podany poniżej kod jest bardziej złożony, ale działa w większości przeglądarek. Podczas pierwszego wejścia na stronę z poziomu przeglądarki Microsoft Internet Explorer (Windows) użytkownik będzie musiał pobrać składnik ActiveX, który umożliwi podgląd obrazu.
Wystarczy jedynie podać parametr BaseURL, będący adresem IP kamery (jak opisano w przykładzie) i podać wartości parametrów ImageResolution, DisplayWidth i Height. 

Przykład

<html>
<title>Strumień wideo na żywo z kamery AXIS</title>
<body>
<center>
<h2>Strumień wideo na żywo z kamery AXIS</h2>


<SCRIPT LANGUAGE="JavaScript">
// Zmienić BaseURL na adres URL kamery
//Przykład: var BaseURL = "http://172.21.1.122/";

var BaseURL = "http://[mojaKamera]/";

// Jeżeli używane są kamery AXIS 241S(A)/241Q(A)/240Q/243SA, zmienić dwa poniższe wiersze:

var Camera = ""; // Jeżeli używane są kamery 240Q/241S(A)/241Q(A)/243SA, skomentować wiersz, wstawiając "//"
// var Camera = "n"; // Zmienić na źródło obrazu wideo używane w AXIS 240Q/ 241S(A)/241Q(A)/243SA i usunąć "//"

// Przejść do używanej kamery i usunąć "//" przed zmienną ImageResolution.
// Można użyć tylko jednej rozdzielczości.

// Wykaz dostępnych rozdzielczości znajduje się na stronie konfiguracji produktu.

// AXIS 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";

// Poniższa ścieżka to ścieżka do pliku tworzącego obraz z kamery
var File = "axis-cgi/mjpg/video.cgi?resolution="+ImageResolution;
// Poniżej nie trzeba wprowadzać zmian
if (Camera != "") {File += "&camera=" + Camera;}
var output = "";
if ((navigator.appName == "Microsoft Internet Explorer") &&
(navigator.platform != "MacPPC") && (navigator.platform != "Mac68k"))
{
// W przypadku korzystania z przeglądarki Internet Explorer w systemie Windows należy użyć ActiveX
output = '<OBJECT ID="Player" width='
output += DisplayWidth;
output += ' height=';
output += DisplayHeight;
output += ' CLASSID="CLSID:DE625294-70E6-45ED-B895-CFFA13AEB044" ';
output += 'CODEBASE="';
output += BaseURL;
output += 'activex/AMC.cab">';
output += '<PARAM NAME="MediaURL" VALUE="';
output += BaseURL;
output += File + '">';
output += '<param name="MediaType" value="mjpeg-unicast">';
output += '<param name="ShowStatusBar" value="0">';
output += '<param name="ShowToolbar" value="0">';
output += '<param name="AutoStart" value="1">';
output += '<param name="StretchToFit" value="1">';
output += '<BR><B>Axis Media Control</B><BR>';
output += 'AXIS Media Control, który umożliwia ';
output += 'podgląd strumienia na żywo w przeglądarce Microsoft Internet';
output += ' Explorer, nie został zarejestrowany na tym komputerze.';
output += '<BR></OBJECT>';
} else {
// Jeżeli nie jest używana przeglądarka IE w systemie Windows, do wyświetlania zostanie użyta przeglądarka
theDate = new Date();
output = '<IMG SRC="';
output += BaseURL;
output += File;
output += '&dummy=' + theDate.getTime().toString(10);
output += '" HEIGHT="';
output += DisplayHeight;
output += '" WIDTH="';
output += DisplayWidth;
output += '" ALT="Camera Image">';
}
document.write(output);
document.Player.ToolbarConfiguration = "play,+snapshot,+fullscreen";

</SCRIPT>
</body>
</html>

Uwaga 1: Więcej opcji znajduje się w przykładach HTML interfejsu WWW produktu lub na stronach dla twórców oprogramowania.

Uwaga 2: Kodu nie należy kopiować i wklejać do programu Microsoft FrontPage. Najpierw należy go wkleić do Notatnika, usunąć formatowanie, a następnie wkleić kod na karcie HTML nowej strony w programie FrontPage.

Ważne: firma Axis nie odpowiada za to, w jaki sposób zmiany w konfiguracji mogą wpłynąć na system. Jeżeli modyfikacja się nie powiedzie lub zakończy w nieoczekiwany sposób, konieczne będzie przywrócenie domyślnych ustawień fabrycznych w sposób opisany w instrukcji użytkowania.