Using webcam with C# web applications

Control web cameras from browsers with Dynamic Webcam API

Introduction to the Webcam Library

Dynamic Webcam SDK is a browser plugin which enables users to acquire images from a webcam, edit and then upload/save them to a database, web server or local disk. Also, it can capture a live video stream into a container and grab a snapshot to be exported to a file/binary. With the webcam API, software developers can integrate image capture, processing and webcam control into browsers.

The plugin works with all webcams that are compatible with Windows Image Acquisition (WIA) and USB video device class (UVC).

It can be developed as a browser-based webcam plug-in or with ActiveX®. Two editions are provided for different browsers: ActiveX Edition for IE and Plugin Edition for other browsers on Windows OS.

 Key Features

  • Capture images & live video streams from UVC compatible webcams.
  • Edit scanned images: rotate, crop, zoom, and etc.
  • Support both GUI and non-GUI image editing.
  • Supports basic image editing features including Rotate, Crop, Mirror, Flip and Erase, etc.
  • Supports Zoom In/Zoom Out.
  • Built-in JPEG, PNG, PDF and TIFF encoders enable you to compress the acquired images.
  • Save/Upload images to your local folders, FTP Sites, Web Servers, databases etc.
  • Image format supported: BMP, JPEG, PNG, (Multi-page) TIFF and (Multi-page) PDF files.
  • Download/Upload image(s) through HTTP/HTTPS or FTP/FTPS.
  • Support SSL for FTP/HTTP uploading/downloading.

Sample Code

1. Use Dynamic Webcam SDK ActiveX Edition.

Firstly, copy DynamicWebcam.cab to the web server. There are 32-bit (for 32bit IE) and 64-bit (for 64bit IE) CAB files. Choose the proper one according to the browser used by the clients. The trial and full versions of Dynamic Webcam use different class ids.

DynamicWebcam.cab can be found in the installation folder of Dynamic Webcam SDK.

For TRIAL version of Dynamic Webcam, insert the following code in your JS code:

<object classid="clsid:A65BC1E1-B2CE-4251-A0CB-721AC7E02B52"
        id="DynamicWebcam1" width="143" height="156"
        CodeBase = "DynamicWebcam.cab#version=8,0">
</object>

For FULL version of Dynamic Webcam:

<object classid="clsid:D5DD8865-F46B-41C4-98F3-6990A6AD97F5"
        id="DynamicWebcam1" width="143" height="156"
        CodeBase = "DynamicWebcam.cab#version=8,0">
</object>

2. Use Dynamic Webcam Plug-in Edition.

Plug-in edition can be used in Gecko-based browsers including Firefox, Chrome, Safari & Opera on PC. For deployment, please copy DynamicWebcam.msi to the web server.

DynamicWebcam.msi can be found in the installation folder of Dynamic Webcam SDK.

<embed type="Application/DynamicWebcam-Plugin" id = "DynamicWebcam" 
       width="100" height="100" pluginspage="DynamicWebcam.msi">
</embed>

3. Server side code

Dynamic Webcam supports ASP.NET, PHP, JSP, ASP, VB.NET, etc. to call functions at the server side. The following are some examples for ASP.NET (C#).

3.1    Save images to the server.
<%@ Page Language="C#"%>

<%

try
{
String strImageName;
HttpFileCollection files = HttpContext.Current.Request.Files;
HttpPostedFile uploadfile = files["RemoteFile"];
strImageName = uploadfile.FileName;
uploadfile.SaveAs(Server.MapPath(".")+
"\\UploadedImages\\"+strImageName);
}

catch
{

}

%>
Name the file above as SavetoFile.aspx, then you can call this page in JavaScript for the upload:
var strHTTPServer = location.hostname;
var CurrentPathName = unescape(location.pathname);
var CurrentPath = CurrentPathName.substring(0, CurrentPathName.lastIndexOf("/") + 1);
var strActionPage = CurrentPath + "SaveToFile.aspx";
var uploadfilename = "Your file name";
…

Webcam. HTTPUploadAllThroughPostAsPDF(
strHTTPServer,
strActionPage,
uploadfilename
);
3.2 Save to database

This is a sample for saving images to database using c#:

<%@ Page Language="C#" %>

<%

try
{

String strImageName;
int iFileLength;

HttpFileCollection files = HttpContext.Current.Request.Files;
HttpPostedFile uploadfile = files["RemoteFile"];
strImageName = uploadfile.FileName;
iFileLength = uploadfile.ContentLength;
Byte[] inputBuffer = new Byte[iFileLength];
System.IO.Stream inputStream;
inputStream = uploadfile.InputStream;
inputStream.Read(inputBuffer,0,iFileLength);

String strConnString;
strConnString = "Data Source=localhost\\sqlexpress;Initial Catalog=DemoWebcam;User ID=sa;Pwd=abcdefg;";
System.Data.SqlClient.SqlConnection sqlConnection = new ystem.Data.SqlClient.SqlConnection(strConnString);
String SqlCmdText = "INSERT INTO tblWebcam (strImageName,imgImageData) VALUES (@ImageName,@Image)";
System.Data.SqlClient.SqlCommand sqlCmdObj = new System.Data.SqlClient.SqlCommand(SqlCmdText, sqlConnection);
sqlCmdObj.Parameters.Add("@Image",System.Data.SqlDbType.Binary,iFileLength).Value = inputBuffer;
sqlCmdObj.Parameters.Add("@ImageName",System.Data.SqlDbType.VarChar,255).Value = strImageName;
sqlConnection.Open();
sqlCmdObj.ExecuteNonQuery();
sqlConnection.Close();
}

catch
{

}

Name this file as SavetoDB.aspx, you can use it the same way as SavetoFile.aspx. There are many other methods for uploading files, like HTTPUploadThroughPostAsMultiPageTIFF, HTTPUploadAllThroughPost, HTTPUploadThroughPostEx, etc.

3.3    Download files from the server

Code below is a sample for downloading image files from your server. You need to pass the file name, file extension and image index in the request.

<%@ Page Language=”C#”%>

<%
//get temp file name
System.Web.HttpRequest request = System.Web.HttpContext.Current.Request;
String strImageName;
String strImageExtName;
String strImageID;
strImageName = request["ImageName"];
strImageExtName = request["ImageExtName"];
strImageID = request["iImageIndex"];
String strConnString;

strConnString = “Data Source=localhost\\sqlexpress;Initial Catalog=DemoWebcam;User ID=sa;Pwd=abcdefg;”;
System.Data.SqlClient.SqlConnection sqlConnection = new System.Data.SqlClient.SqlConnection(strConnString);
System.Data.SqlClient.SqlCommand sqlCmdObj = new System.Data.SqlClient.SqlCommand(“SELECT imgImageData FROM tblWebcam WHERE iImageID= ” + strImageID, sqlConnection);
sqlConnection.Open();
System.Data.SqlClient.SqlDataReader sdrRecordset = sqlCmdObj.ExecuteReader();
sdrRecordset.Read();
long iByteLength;
iByteLength = sdrRecordset.GetBytes(0, 0, null, 0, int.MaxValue);
byte[] byFileData = new byte[iByteLength];

sdrRecordset.GetBytes(0, 0, byFileData, 0, Convert.ToInt32(iByteLength));
sdrRecordset.Close();
sqlConnection.Close();
sdrRecordset = null;
sqlConnection = null;
Response.Clear();
Response.Buffer = true;

if(strImageExtName == “bmp”){
	Response.ContentType = “image/bmp”;
	}else if(strImageExtName == “jpg”){
	Response.ContentType = “image/jpg”;
	}else if(strImageExtName == “tif”){
	Response.ContentType = “image/tiff”;
	}else if(strImageExtName == “png”){
	Response.ContentType = “image/png”;
	}else if(strImageExtName == “pdf”){
	Response.ContentType = “application/pdf”;
}

try{
	String fileNameEncode;
	fileNameEncode = HttpUtility.UrlEncode(strImageName, System.Text.Encoding.UTF8);
	fileNameEncode = fileNameEncode.Replace(“+”, “%20″);
	String appendedheader = “attachment;filename=” + fileNameEncode;
	Response.AppendHeader(“Content-Disposition”, appendedheader);
	Response.OutputStream.Write(byFileData, 0, byFileData.Length);
}

catch(Exception){
	Response.Flush();
	Response.Close();
}
%>

For more info on how to use the methods, properties and events of Dynamic Webcam SDK, you can refer to the help file installed with Dynamic Webcam SDK.

4. Deploying Dynamic Webcam to your production server

To deploy Dynamic Webcam on your production server, the Web Server License of Dynamic Webcam SDK is needed. The evaluation license can’t be used for production.

Get Samples

To try out the above mentioned features by yourself, you can download the 30-day free trial of Dynamic Webcam.  The samples can be found in the installation folder of the SDK.

If you have any questions, you can contact our support team at support@dynamsoft.com.