HTML5 call computer camera to take pictures

Front Code:

<DivID= "Contentholder">        <VideoID= "Video"width= " the"Height= " the"AutoPlay></Video>        <ButtonID= "Snap"style= "Display:none">Photo</Button>        <Canvasstyle= "Display:none"ID= "Canvas"width= " the"Height= " the"></Canvas>    </Div>

JS Code:

<Script>    //this generation is mainly to get the video stream of the camera and display it inWindow.addeventlistener ("domcontentloaded", function () {               varCanvas=document.getElementById ("Canvas"), Context=Canvas.getcontext ("2d"), Video=document.getElementById ("Video"), Videoobj= { "Video": true}, Errback= function(Error) {Console.log ("Video capture Error:", Error.code);                   }; //Navigator.getusermedia in opera is like a navigator.getusermedianow.        if(Navigator.getusermedia) {Navigator.getusermedia (videoobj,function(stream) {video.src=stream;                   Video.play ();               }, Errback); } Else if(Navigator.webkitgetusermedia) {Navigator.webkitgetusermedia (videoobj,function(stream) {video.src=Window.webkitURL.createObjectURL (stream);                   Video.play ();               }, Errback); }               //This is the photo button event,     $("#snap"). Click (function() {context.drawimage (video,0, 0,  the,  the); //Catchcode ();     }); }, false); //Timer  varinterval=setinterval (Catchcode," -"); //This is a refresh of the image.   functionCatchcode () {$ ("#snap"). Click ();//practical use can not write, test generation, click the photo button to get the current image, there are other uses           varCanvans=document.getElementById ("Canvas"); //gets the canvas object for the browser page   //The following starts compiling data                                  varImgdata=Canvans.todataurl ();//convert an image to Base64 data               varBase64data=Imgdata.substr ( A); //truncate 22-bit string as image data on the front-end                            //begins asynchronously on$.post ("uploadimgcode.ashx", { "img": Base64data},function(data, status) {if(Status== "Success") {                       if(Data== "OK") {alert ("Two-dimensional has been resolved"); }                       Else {                           //alert (data);              }                   }                   Else{alert ("failed on data"); }               }, "text"); }       </Script> 

Background code:

 Public voidProcessRequest (HttpContext context) {stringimg//receive a string after base64Context. Response.ContentType ="Text/plain"; Try{img=context. request["img"]. ToString ();//Get Base64 string    byte[] Imgbytes =convert.frombase64string (IMG);//converting a Base64 string to a byte arraySystem.IO.Stream Stream =NewSystem.IO.MemoryStream (imgbytes);//convert a byte array to a byte stream//will stream back to the image to convert the PNG photo to JPG and compress the volume for saving. System.Drawing.Image Imgae =System.Drawing.Image.FromStream (stream); Imgae. Save (context. Server.MapPath ("~/test/") + Guid.NewGuid (). ToString () +". jpg", System.Drawing.Imaging.ImageFormat.Jpeg);//Save PictureContext. Response.Write ("OK");//Output Call Result}Catch(Exception msg) {img=NULL; Context.              Response.Write (msg); return; }                   }

Code Source: http://bbs.9ria.com/thread-215588-1-1.html

HTML5 call computer camera to take pictures