2011-03-10 105 views
2

我有一个在线预订管理系统,需要捕获正在预订到系统中的人员的图像。我目前支持从客户机上的本地目录(Facebook,LinkedIn等)手动上传图像到网站。但是,我还需要客户端能够单击一个按钮,使他们能够使用连接到客户端计算机的摄像头(网络摄像头或其他)来拍摄快照并自动将其上传到服务器。如何从.Net世界的网站捕捉摄像头图像?

客户端环境中基于Windows,和我的开发环境是ASP.Net MVC 3

是否有任何第三方的ActiveX或Flash控件可以做到这一点?

+0

可能的配音http://stackoverflow.com/questions/1350594/use-flash-capture-webcam-image – Andrey 2011-03-10 15:01:22

+0

看看这个博文在哪里vamapaull已经在Flash中做到了这一点:http://blog.vamapaull.com/? p = 355 – tkalve 2011-03-10 15:04:15

+0

看看这个链接,,,提供的.swf文件运行良好,你可以在你的页面中使用它,以使用户捕捉图像 [来自网页摄像头的图像](http://www.tuttoaster。 com/create-a-camera-application-in-flash-using-actionscript-3 /) – freebird 2012-03-20 12:09:30

回答

4

一个教程中,我发现了一个第三方的开源的Flash + JavaScript库,使得这相当简单称为“jpegcam”。

以下代码是针对Asp.Net MVC 3 (Razor View + T4MVC)构建的。


步骤1:包括JavaScript库

<script type="text/javascript" src="@Url.Content("~/Scripts/jpegcam/htdocs/images.js")"></script> 

步骤2:安装jpegcam及导线上必要钩

<script type="text/javascript"> 
    webcam.set_api_url('@Url.Action(MVC.Images.Snapshot())'); 
    webcam.set_swf_url('@Url.Content("~/Scripts/jpegcam/htdocs/webcam.swf")'); 
    webcam.set_quality(90); // JPEG quality (1-100) 
    webcam.set_shutter_sound(false, '@Url.Content("~/Scripts/jpegcam/htdocs/shutter.mp3")'); 
    webcam.set_hook('onComplete', 'upload_complete'); 

    document.write(webcam.get_html(320, 240)); 

    function upload() { 
     webcam.freeze(); // Snapshot the image from the camera 
     webcam.upload(); // POST the data w/ content type 'image/jpeg' 
    } 
    function upload_complete(response) { 
     var json = jsonParse(response); 
     if (json.Redirect) { 
      window.location.replace(json.Redirect); 
     } else if (json.Error) { 
      Notifier.Error('Error', json.Error.Message); 
      webcam.reset(); 
     } else { 
      Notifier.Error('Error', 'An unknown error has occurred.'); 
      webcam.reset(); 
     } 
    } 
</script> 

注:webcam.set_api_url()呼叫建立POST网址。

步骤3:电线向上在视图中的按钮

<p class="actions"> 
    <input id="capture-configure" class="secondary-button" type="button" value="Configure..." onclick="webcam.configure()" /> 
    <input id="capture-submit" class="primary-button" type="button" value="Snap Mugshot" onclick="upload()" /> 
    <span class="alternate"> 
     or <a class="cancel" href="@Url.Action(MVC.Images.View())">Cancel</a> 
    </span> 
</p> 

步骤4:创建控制器操作以服务于POST

[HttpPost] 
public virtual ActionResult Snapshot() 
{ 
    var image = new System.Web.Helpers.WebImage(Request.InputStream); 
    // Do fun, amazing things with the jpeg image 
    return RedirectToAction(MVC.Images.View()); 
} 

注:System.Web.Helpers.WebImage是部分'microsoft-web-helpers'NuGet包。

+0

谢谢JD!我用我的WebForms的示例代码。我用:'byte [] data = context.Request.BinaryRead(context.Request.TotalBytes); File.WriteAllBytes(context.Server.MapPath(“〜/ img/Webcam”+ DateTime.Now.Ticks.ToString()+“.jpg”),data);'这为您节省了导入microsoft-网络助手 – 2011-11-28 12:45:00

1

也许你可以使用Silverlight 4?版本4支持网络摄像头。

这里是在SilverlightShow.net

+0

我对Silverlight在客户机上的使用寿命没有信心,因为我使用Flash。然而,想到这个链接,这是有趣的阅读! – 2011-03-13 03:01:56