Two IP camera on my website

[skadoc 0]

Hello,

 

I want to display the video stream of IP camera two on my website. For this I use the following script:

 

<script language="JavaScript" type="text/javascript">
	// <![CDATA[
	if ((navigator.appName == "Microsoft Internet Explorer") && (navigator.platform != "MacPPC")) {
		document.write("<OBJECT ID=\"RtspVapgCtrlMulti\" WIDTH=400 HEIGHT=300 name=\"RtspVapgCtrlMulti\"");
		document.write(" CLASSID=CLSID:73888E2B-FF04-416C-8847-984D7FC4507F");
		document.write(" CODEBASE=\"http://000.000.000.000/RtspVaPgDecNew2.cab\">");
		document.write("<PARAM NAME=\"VSize\" VALUE=\"SIF\">");
		document.write("<PARAM NAME=\"Language\" VALUE=\"EN\">");
		document.write("<PARAM NAME=\"ClickEventHandler\" VALUE=\"3\">");
		document.write("<PARAM NAME=\"Url\" VALUE=\"http://000.000.000.000:8080/cgi-bin/control.cgi\">");
		document.write("<PARAM NAME=\"ViewStream\" VALUE=\"0\">");
		document.write("</OBJECT>");
	} else {
		document.write("<OBJECT ID=\"quicktime\" WIDTH=400 HEIGHT=300 name=\"quicktime\"");
		document.write(" CLASSID=CLSID:02bf25d5-8c17-4b23-bc80-d3488abddc6b\">");
		document.write("<embed scale=\"ToFit\" width=\"400\" height=\"300\" type=\"video/quicktime\" qtsrc=\"rtsp://000.000.000.000/live.sdp\"src=\"http://000.000.000.000:5555/realqt.mov\" qtsrcdontusebrowser autoplay=\"true\" controller=\"true\" />");
		document.write("</OBJECT>");
	}
	// ]]>

</script>
<script language="JavaScript" type="text/javascript">
	// <![CDATA[
	if ((navigator.appName == "Microsoft Internet Explorer") && (navigator.platform != "MacPPC")) {
		document.write("<OBJECT ID=\"RtspVapgCtrlChouette\" WIDTH=400 HEIGHT=300 name=\"RtspVapgCtrlChouette\"");
		document.write(" CLASSID=CLSID:73888E2B-FF04-416C-8847-984D7FC4507F");
		document.write(" CODEBASE=\"http://000.000.000.000/RtspVaPgDecNew2.cab\">");
		document.write("<PARAM NAME=\"VSize\" VALUE=\"SIF\">");
		document.write("<PARAM NAME=\"Language\" VALUE=\"EN\">");
		document.write("<PARAM NAME=\"ClickEventHandler\" VALUE=\"3\">");
		document.write("<PARAM NAME=\"Url\" VALUE=\"http://000.000.000.000:8082/cgi-bin/control.cgi\">");
		document.write("<PARAM NAME=\"ViewStream\" VALUE=\"0\">");
		document.write("</OBJECT>");
	} else {
		document.write("<OBJECT ID=\"quicktime\" WIDTH=400 HEIGHT=300 name=\"quicktime\"");
		document.write(" CLASSID=CLSID:02bf25d5-8c17-4b23-bc80-d3488abddc6b\">");
		document.write("<embed scale=\"ToFit\" width=\"400\" height=\"300\" type=\"video/quicktime\" qtsrc=\"rtsp://000.000.000.000/live.sdp\"src=\"http://000.000.000.000:5557/realqt.mov\" qtsrcdontusebrowser autoplay=\"true\" controller=\"true\" />");
		document.write("</OBJECT>");
	}
	// ]]>

</script>

 

 

By cons I have a problem with the Mozilla browser with port 554. I can only see my video if I change the port number. I can change the configuration of my camera Vivotek in my NAT rules to open the port number, but it does not work.

 

Do you have an idea for me?

[buellwinkle 0]

When you try and stream RTSP on a web page, it's going to be a headache with browser support. I convert my stream to RTMP for this purpose.

[skadoc 0]

That is to say? I do not understand what you offer me?

[buellwinkle 0]

Web browser do not have support to playback RTSP streams. So there's ActiveX or Java applets that are specific to a camera and browser like IE where you can stream the video from the camera to a web page. For example, with Axis cameras, they provide a way to stream to a web page using Quicktime to play, but this requires the person viewing to have software installed and may or may not work with all browser. If this is for personal use, meaning just you or your close friends, it's will work but for a web page open to the public, this solution won't work.

 

Enter HTML5 and/or Adobe Flash. To view streaming video on the camera, you have to have a way of re-streaming from RTSP to a format suitable for a Flash player or HTM5 player, that's how most websites that have streaming video do it.

 

So you need software that converts the RTSP stream to an RTMP stream. Wowsa is probably the most popular commercial solution. I use Unreal Media Server free version and have an example on my blog. VLC will work, but I was not happy with the video quality but also free. Wowsa is not free but maybe more suitable for a larger project.

 

A while back, someone proposed taking JPG snapshots from the camera in Javascript and rapidly displaying them in a loop to form motion video. Don't know where this went, but with today's HD cameras, not sure that you would be happy with the frame rate. Recently someone I know tried this with a Dahua camera and don't even think he got 1 fps.

[what-da 0]

Try this trans coder it competes with wowza and it is one off payment.

www.ipvideotrans.com

[skadoc 0]

Thank you for this info-rich information. Would you have a tuturiel on Unreal Media Server application to configure the well, and especially to be able to integrate a script inséser in an html page because it is not very clear on the website.

[skadoc 0]

On www.ipvideotrans.com is a free 30-day trial. It's a shame, because it seems easy to use.

[skadoc 0]

I use the vivotek camera FD8133

[viralcameras 0]

you can place directly the videostream on your page inside html tags. the prerequisite is - you have to know ip address, port and the post url in order to stream the video.

One thing - if you want to secure the camera - then you have to set the password on it.

Some of the example of open cameras you can find here:

http://www.viralcameras.com/0/posts/16-house-building/19-house-building/39273-big-pretty-and-nice-building-in-canada-online-camera.html

or

http://www.viralcameras.com/0/posts/13-bar-cafe/16-bar-cafe/38941-ukraine-camera-online-lviv.html

or any other.

The tag will be something like:

- this depends on the camera brand/type you want to be shown

 

Thanks.

[dexterash 0]

^What a stupid post. Since when H.264/H.264 cameras use MJPEG?!?!