D-Link Forums

D-Link IP Cameras for Home => DCS series Network Cameras => Topic started by: Adelbert on October 13, 2009, 03:39:04 AM

Title: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: Adelbert on October 13, 2009, 03:39:04 AM
Hey all,

I'm trying to embed the live video from the DLink standard site to our company's website. However, after trying to edit the HTML, I get the following error: "Connection failed!"

(http://xs344.xs.to/xs344/09422/errorsite926.jpg)

This is the code I'm using, editing the original from the camera:

Quote
<html>
   <head>
      <script type="text/javascript" src="http://10.164.184.149/cgi-bin/pubinfo.cgi"></script>
      <link rel="STYLESHEET" type="text/css" href="http://10.164.184.149/dlink.css">
      <script type="text/javascript" src="http://10.164.184.149/common.js"></script>
      <script type="text/javascript" src="http://10.164.184.149/camctrl.js"></script>
      <script type="text/javascript" src="http://10.164.184.149/plugindef.js"></script>
   </head>
   <body onload=resizeIframe()>
      <table width="100%">
         <tr>
            <td valign="top" id="maincontent_container">
               <div id=maincontent>
                  <!-- === BEGIN MAINCONTENT === -->
                  
                  <div class=box>
                     <h2>Live video</h2>
                     <div align="center">
                        <table>
                           <tr>
                              <td>
                                 <script language="JavaScript">
                                    <!--
                                    if(((MaxSessionNum - CurrentSessionNum) == 0) && (EnableSnapMode == 1))
                                    {
                                       var refreshrate=SnapshotInterval;
                                       var image="http://10.164.184.149/cgi-bin/video.jpg";
                                       var imgwidth=Width;
                                       var imgheight=Height;
                                       function refresh(){
                                          document.images["pic"].src=image+"?"+new Date();
                                          setTimeout('refresh()', refreshrate*1000);}
                                       document.write('<img src="'+image+'" height="'+imgheight+'" width="'+imgwidth+'" name="pic">');
                                       if(document.images) window.onload=refresh;
                                    }
                                    else
                                    {
                                       showimage("0");
                                       /*
                                       // The ActiveX plug-in
                                       document.write("<object id=\"" + PLUGIN_ID + "\" width=" + (Width + X_OFFSET_CTRL) + " height=" + (Height + Y_OFFSET_CTRL));
                                          document.write(" standby=\"Loading plug-in...\" classid=CLSID:" + CLASS_ID);
                                          document.write(" codebase=\"/" + PLUGIN_NAME + "#version=" + PLUGIN_VER + "\">");
                                          document.write("<param name=\"Url\" VALUE=\"rtsp://" + location.hostname + "/" + RTSPAccessName +"\">");
                                          document.write("<param name=\"Stretch\" VALUE=\"" + STRETCH + "\">");
                                          document.write("<param name=\"VSize\" VALUE=\"CMS\">");
                                          document.write("<param name=\"Language\" VALUE=\"" + PLUGIN_LANG + "\">");
                                          document.write("<param name=\"ClientOptions\" VALUE=\"4663\">");
                                          document.write("<param name=\"MP4Conversion\" VALUE=\"true\">");
                                          document.write("This camera requires an ActiveX Plug-in to be installed. If you see this text, your browser is not supported or your computer has ActiveX disabled.");
                                          document.write("<\/object>");
                                          */
                                       }
                                       //-->
                                    </script>
                                 </td>
                              </tr>
                           </table>
                           <br>
                           <label></label>
                           <p><br>
                           </p>
 
                        </div>
                     </div>
                  </div>
               </td>
            </tr>
         </table>
      </body>
   </html>

As you can see, I'm just adding the "http://10.164.184.149/" on every SRC I see, but I see that error. However, that error doesn't appears when entering the standard site allocated in the camera.

Can anyone give me a hand? Is there any other way to embed the stream from the camera on my own web page?

Thanks a million for your help, and sorry for my english, I know it isn't perfect :P
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: ECF on October 13, 2009, 08:29:20 AM
Well first off when I enter http://10.164.184.149 into the browser your camera does not come up so it looks like it is not configured for remote access properly. Do you have a port to access the camera at?
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: Adelbert on October 14, 2009, 01:26:59 AM
Well first off when I enter http://10.164.184.149 into the browser your camera does not come up so it looks like it is not configured for remote access properly. Do you have a port to access the camera at?

Yeah sorry, I forgot to say that: this ip is for our internal network only, it works fine when I try to see the camera in it's original interface when I'm only inside my office, it just won't work outside :)

Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: ECF on October 14, 2009, 09:08:38 AM
Try the FAQ on our support site at dlink.com and goto the support tab.
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: Adelbert on October 15, 2009, 02:43:47 AM
Try the FAQ on our support site at dlink.com and goto the support tab.

Thanks a million for yout help and time ECF :)

I found the FAQ, and this is now the code I'm using:

Quote
<html>
<head>
<title>Applus +</title>
<SCRIPT LANGUAGE="VBScript">
<!--
Sub VACtrl_OnClick(V1, V2)
   val = "X = " + CStr(V1) + ", Y = " + CStr(V2)
   
   MsgBox val
End Sub
//-->
</SCRIPT>
</head>

<body>
<table width="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td> Use only parameters, Please change the username, password, server.domain.hostname and servertype to the actual values in your site </td>
</tr>
<tr>
<td align=center>
<table width=800 border=0>
<tr>
<td align=center>
<script language="JavaScript">
<!--
if ((navigator.appName == "Microsoft Internet Explorer")&&(navigator.platform != "MacPPC"))
{
document.write("<OBJECT ID=\"VitaminDecoder\" WIDTH=330 HEIGHT=300" );
document.write(" CLASSID=CLSID:70EDCF63-CA7E-4812-8528-DA1EA2FD53B6");
document.write(" CODEBASE=\"VitaminCtrl.cab#version=1,1,0,4\">");
document.write("<PARAM NAME=\"RemoteIPAddr\" VALUE=\"10.164.184.149\">");
document.write("<PARAM NAME=\"UserName\" VALUE=\"admin\">");
document.write("<PARAM NAME=\"Password\" VALUE=\"admin\">");
document.write("<PARAM NAME=\"AutoServerModelType\" VALUE=\"true\">");
document.write("</OBJECT>");
}
//-->
</script>
</td>

</tr>
</table>
</td>
</tr>
</table>
</body>
</html>

However, this is the result:
(http://xs844.xs.to/xs844/09424/error3784.jpg)

You know what may be wrong? As I told you, if i put that ip on my browser, my camera shows up perfectly, so probably the script has something wrong :/

One more thing: i see in the FAQ it says that's the embed code for the 6620 camera. However, the code I see in the 6620 FAQ page is slighlty different:

Quote
<SCRIPT language=JavaScript>
<!-- if ((navigator.appName == "Microsoft Internet Explorer")&&(navigator.platform != "MacPPC"))
{
document.write("<OBJECT ID=\"VAtCtrl\" WIDTH=362 HEIGHT=358 name=\"VAtCtrl\"");
document.write(" CLASSID=CLSID:210D0CBC-8B17-48D1-B294-1A338DD2EB3A");
document.write(" CODEBASE=\"http://24.45.76.223:888/VatDec.cab#version=1,0,0,33\">");
document.write("<PARAM NAME=\"VSize\" VALUE=\"SIF\">");
document.write("<PARAM NAME=\"Language\" VALUE=\"EN\">");
document.write("<PARAM NAME=\"Deblocking\" VALUE=\"true\">");
document.write("<PARAM NAME=\"DisplayTimeFormat\" VALUE=\"1\">");
document.write("<PARAM NAME=\"DigitalZoomEnableChk\" VALUE=\"true\">");
document.write("<PARAM NAME=\"DigitalZoomEdit\" VALUE=\"true\">");
document.write ("<PARAM NAME=\"Url\" VALUE=\"http://admin:password@24.45.76.223:888/cgi-bin/control.cgi\">"); document.write("</OBJECT>");
}
//-->
</SCRIPT>

Maybe I should change something from my 5520 code? Anyways, again, thanks for your help and your time, it is really important for us to embed this camera to our company site, so your help is much appreciated :)
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: kandm00 on October 15, 2009, 08:58:50 AM
Unless I missed it somewhere it's not clear whether or not your camera can be accessed directly from the internet.  You won't be able to embed it on a web page if it is not.

When embedding the camera code on a web page the CODEBASE needs the full public URL to the cab file on the camera. 

Code: [Select]
document.write(" CODEBASE=\"http://PUBLICIP:PORT/VitaminCtrl.cab#version=1,1,0,4\">");
The RemoteIPAddr PARAM probably needs the public ip address as well.
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: Adelbert on October 16, 2009, 01:45:29 AM
Unless I missed it somewhere it's not clear whether or not your camera can be accessed directly from the internet.  You won't be able to embed it on a web page if it is not.

When embedding the camera code on a web page the CODEBASE needs the full public URL to the cab file on the camera. 

Code: [Select]
document.write(" CODEBASE=\"http://PUBLICIP:PORT/VitaminCtrl.cab#version=1,1,0,4\">");
The RemoteIPAddr PARAM probably needs the public ip address as well.

Oh, nice, yeah i forgot that :P.

However, my camera doesn't seems to have that file on that adress. I mean, I can access to any file of the camera just entering http://MYIP/thefile.extension on my browser (yeah, without any port), but http://10.164.184.149/VitaminCtrl.cab doesn't seems to work, the file doesn't seems to be there. Maybe is it called different or is in any other folder of the camera?

Edit: Ok, i think I found my .cab file, it is called RtspVaPgDec.cab. However, the isn't working yet :(

Here is the code now:

Quote
<html>
<head>
<title>Applus +</title>
<SCRIPT LANGUAGE="VBScript">
<!--
Sub VACtrl_OnClick(V1, V2)
   val = "X = " + CStr(V1) + ", Y = " + CStr(V2)
   
   MsgBox val
End Sub
//-->
</SCRIPT>
</head>

<body>
<table width="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td> Use only parameters, Please change the username, password, server.domain.hostname and servertype to the actual values in your site </td>
</tr>
<tr>
<td align=center>
<table width=800 border=0>
<tr>
<td align=center>
<script language="JavaScript">
<!--
if ((navigator.appName == "Microsoft Internet Explorer")&&(navigator.platform != "MacPPC"))
{
document.write("<OBJECT ID=\"VitaminDecoder\" WIDTH=330 HEIGHT=300" );
document.write(" CLASSID=CLSID:70EDCF63-CA7E-4812-8528-DA1EA2FD53B6");
document.write(" CODEBASE=\"http://10.164.184.149:80/RtspVaPgDec.cab#version=1,1,0,4\">");
document.write("<PARAM NAME=\"RemoteIPAddr\" VALUE=\"http://10.164.184.149:80\">");
document.write("<PARAM NAME=\"UserName\" VALUE=\"admin\">");
document.write("<PARAM NAME=\"Password\" VALUE=\"figueras\">");
document.write("<PARAM NAME=\"AutoServerModelType\" VALUE=\"true\">");
document.write("</OBJECT>");
}
//-->
</script>
</td>

</tr>
</table>
</td>
</tr>
</table>
</body>
</html>

Maybe the version of that code line for the .cab file is wrong? :\
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: kandm00 on October 16, 2009, 01:24:35 PM
Different cameras use different code so the best thing to do is go to the main video streaming page on your camera (preferably from the internet side), view the html source, copy it into a new html file on your web server, add full url paths to any files referenced on the camera, and remove all the stuff you don't need.

For example, when I remove all the extra stuff from the Java video streaming page for my DCS-920s I end up with:

Code: [Select]
<html>
<head>
<title>CAMERA</title>
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">
</head>
<body>
    <APPLET name="cvcs" CODEBASE="http://192.168.2.111:80/" CODE="xplug.class" WIDTH=640 HEIGHT=480>
    <param name="RemotePort" value=80>
    <param name="Timeout" value=5000>
    <param name="RotateAngle" value=0>
    <param name="PreviewFrameRate" value=2>
    <param name="DeviceSerialNo" value="">
    </APPLET>
</body>
</html>
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: Adelbert on October 19, 2009, 01:28:48 AM
Different cameras use different code so the best thing to do is go to the main video streaming page on your camera (preferably from the internet side), view the html source, copy it into a new html file on your web server, add full url paths to any files referenced on the camera, and remove all the stuff you don't need.

For example, when I remove all the extra stuff from the Java video streaming page for my DCS-920s I end up with:

Code: [Select]
<html>
<head>
<title>CAMERA</title>
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">
</head>
<body>
    <APPLET name="cvcs" CODEBASE="http://192.168.2.111:80/" CODE="xplug.class" WIDTH=640 HEIGHT=480>
    <param name="RemotePort" value=80>
    <param name="Timeout" value=5000>
    <param name="RotateAngle" value=0>
    <param name="PreviewFrameRate" value=2>
    <param name="DeviceSerialNo" value="">
    </APPLET>
</body>
</html>

That's what I was trying to do on my first post, but it didn't work either :(
Title: Re: Embedding a DCS-5220 to my own site, what I'm doing wrong?
Post by: kandm00 on October 19, 2009, 10:14:20 AM
Try replacing the following line:

Code: [Select]
document.write("<param name=\"Url\" VALUE=\"rtsp://" + location.hostname + "/" + RTSPAccessName +"\">");
with

Code: [Select]
document.write("<param name=\"Url\" VALUE=\"rtsp://10.164.184.149/" + RTSPAccessName +"\">");