1. Foreground JSP page code
<%@ page language= "java" contenttype= "text/html; Charset=utf-8 "
pageencoding= "Utf-8"%>
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "HTTP://WWW.W3.ORG/TR/HTML4/LOOSE.DTD" >
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">
<title>video Cap Control demo</title>
<script type= "Text/javascript" src= "/js/jquery-1.4.2.min.js" ></script>
<script type= "Text/javascript" src= "Test1.js" ></script>
<body>
<form action= "<%=request.getcontextpath ()%>/servlet/videocap" id= "Cap_form" method= "POST" >
<input type= "hidden" id= "Picdata" name= "Picdata" >
<object classid= "Clsid:34681db3-58e6-4512-86f2-9477f1a9f3d8"
Id= "WebVideoCap1" codebase= "<%=request.getcontextpath ()%>/cabs/package.cab#version=1,0,0,50" width= "636" height= "238" >
<param name= "Visible" value= "0" >
<param name= "AutoScroll" value= "0" >
<param name= "AutoSize" value= "0" >
<param name= "Axborderstyle" value= "1" >
<param name= "Caption" value= "Webvideocap" >
<param name= "Color" value= "4278190095" >
<param name= "Font" value= "Song Body" >
<param name= "KeyPreview" value= "0" >
<param name= "PixelsPerInch" value= ">"
<param name= "Printscale" value= "1" >
<param name= "Scaled" value= "-1" >
<param name= "DropTarget" value= "0" >
<param name= "HelpFile" value>
<param name= "Popupmode" value= "0" >
<param name= "Screensnap" value= "0" >
<param name= "Snapbuffer" value= "ten" >
<param name= "Docksite" value= "0" >
<param name= "doublebuffered" value= "0" >
<param name= "parentdoublebuffered" value= "0" >
<param name= "Usedockmanager" value= "0" >
<param name= "Enabled" value= "-1" >
<param name= "alignwithmargins" value= "0" >
<param name= "Parentcustomhint" value= "-1" >
</object>
<input type= "button" value= "Hide control button" id= "Btn_hidden_btns" >
<input type= "button" value= "Show Control button" id= "Btn_show_btns" >
<input type= "button" value= "Start Capture" id= "Btn_start" >
<input type= "button" value= "Stop Capture" id= "Btn_stop" >
<input type= "button" value= "Photography" id= "btn_cap_only" >
<input type= "button" value= "take photos and use Ajax to submit" id= "Btn_cap" >
<input type= "button" value= "camera and non-Ajax presentation" id= "Btn_submit" >
<input type= "button" value= "No camera direct submission" id= "Btn_submit_only" >
<input type= "button" value= "Only get Base64 data" id= "Btn_getdata_only" >
<input type= "button" value= "Purge Data" id= "Btn_clear" >
JPEG format Base64 encoded data content:
<textarea rows= "cols=" id= "Base64_jpeg" name= "Base64_jpeg" ></textarea>
BMP format Base64 encoded data content:
<textarea rows= "cols=" id= "base64_bmp" name= "Base64_bmp" ></textarea>
</form>
</body>
------------------------------------------------------------------
2.js file Test1.js
String.prototype.replaceAll = function (S1, S2) {
Return This.replace (New RegExp (S1, "GM"), S2);
}
$ (function () {
$ (' #btn_hidden_btns '). Click (function () {
document.getElementById (' WebVideoCap1 '). Hiddencontrollbuttons ();
document.getElementById (' WebVideoCap1 '). AutoFill (636, false);
}), $ (' #btn_show_btns '). Click (function () {
document.getElementById (' WebVideoCap1 '). Showcontrollbuttons ();
document.getElementById (' WebVideoCap1 '). AutoFill (636, true);
}), $ (' #btn_start '). Click (function () {
document.getElementById (' WebVideoCap1 '). Start ();
}), $ (' #btn_stop '). Click (function () {
document.getElementById (' WebVideoCap1 '). Stop ();
}), $ (' #btn_cap_only '). Click (function () {
document.getElementById (' WebVideoCap1 '). Cap ();
}), $ (' #btn_cap '). Click (function () {
document.getElementById (' WebVideoCap1 '). Cap ();
document.getElementById (' Base64_jpeg '). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
document.getElementById (' base64_bmp '). Value = document
. getElementById (' WebVideoCap1 '). Bmpbase64data;
document.getElementById ("Picdata"). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
Ajax_post ();
}), $ (' #btn_submit_only '). Click (function () {
document.getElementById (' WebVideoCap1 '). Cap ();
document.getElementById (' Base64_jpeg '). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
document.getElementById (' base64_bmp '). Value = document
. getElementById (' WebVideoCap1 '). Bmpbase64data;
document.getElementById ("Picdata"). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
Alert (document.getElementById ("Picdata"). Value.length);
Document.forms[0].submit ();
}), $ (' #btn_getdata_only '). Click (function () {
document.getElementById (' Base64_jpeg '). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
document.getElementById (' base64_bmp '). Value = document
. getElementById (' WebVideoCap1 '). Bmpbase64data;
document.getElementById ("Picdata"). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
Alert (document.getElementById ("Picdata"). Value.length);
}), $ (' #btn_clear '). Click (function () {
document.getElementById (' WebVideoCap1 '). Clear ();
}), $ (' #btn_submit '). Click (function () {
document.getElementById (' WebVideoCap1 '). Cap ();
document.getElementById (' Base64_jpeg '). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
document.getElementById (' base64_bmp '). Value = document
. getElementById (' WebVideoCap1 '). Bmpbase64data;
document.getElementById ("Picdata"). Value = document
. getElementById (' WebVideoCap1 '). Jpegbase64data;
Alert (document.getElementById ("Picdata"). Value.length);
Document.forms[0].submit ();
});
});
function Ajax_post () {
var base64_data = document.getElementById (' WebVideoCap1 '). Jpegbase64data;
$.ajax ({
URL: ' Http://localhost:8080/VideoCap/servlet/VideoCap4Ajax ',
Type: ' POST ',
DataType: ' Jason ',
Data: {
Picdata: "'" + Base64_data + "'"
},
timeout:1000,
Success:callbackfun
});
}
function Callbackfun (data) {
var obj = eval (' (' + data + ') ');
if (' OK ' = = Obj.savestatus) {
Alert (' Photo capture successful! ');
}
}
3.java Code
-------------------------------------------------------------------
Package Com.demo;
Import Java.io.File;
Import Java.io.FileOutputStream;
Import java.io.IOException;
Import Java.io.OutputStream;
Import Java.io.PrintWriter;
Import Javax.servlet.Servlet;
Import Javax.servlet.ServletConfig;
Import javax.servlet.ServletException;
Import Javax.servlet.http.HttpServlet;
Import Javax.servlet.http.HttpServletRequest;
Import Javax.servlet.http.HttpServletResponse;
Import Sun.misc.BASE64Decoder;
/**
* Servlet Implementation Class Videocap
*/
public class Videocap extends HttpServlet {
Private static final long serialversionuid = 1L;
Private String Savepath;
/**
* @see Httpservlet#httpservlet ()
*/
Public Videocap () {
Super ();
TODO auto-generated Constructor stub
}
/**
* @see Servlet#init (servletconfig)
*/
public void init (ServletConfig config) throws servletexception {
Savepath=config.getservletcontext (). Getrealpath ("/") + "//pics//";
File Tmp_path=new file (Savepath);
Tmp_path.mkdirs ();
System.out.println ("Photo Data save path:" +savepath);
}
/**
* @see Httpservlet#doget (httpservletrequest request, httpservletresponse response)
*/
protected void doget (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {
TODO auto-generated Method Stub
}
/**
* @see Httpservlet#dopost (httpservletrequest request, httpservletresponse response)
*/
protected void DoPost (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {
String pic_base_64_data=request.getparameter ("Picdata");
System.out.println ("Picture data:" +pic_base_64_data);
Base64decoder decode=new Base64decoder ();
Byte[] Datas=decode.decodebuffer (pic_base_64_data);
String filename=string.valueof (System.currenttimemillis ()) + ". jpg";
File File=new file (this.savepath+filename);
OutputStream fos=new fileoutputstream (file);
System.out.println ("Photo file name:" +filename);
Fos.write (datas);
Fos.close ();
Response.setcontenttype ("text/html");
PrintWriter Out=response.getwriter ();
Out.print ("Out.flush ();
Out.close ();
}
}
Article from: http://peihexian.iteye.com/blog/676246