2013-12-07 23 views
6

MVC4 sayfasında jquery webcam eklentisi kullanıyorum. Eklenti burada: http://www.xarg.org/project/jquery-webcam-plugin/.jquery web kamerası eklentisi yakalanan görüntüyü göndermiyor

Resim çekildikten sonra eklentide kaydetme yöntemini kullanıyorum ancak denetleyici eylemine gönderilmiyor.

Bu

cshtml sayfası:

@{ 
    ViewBag.Title = "Index"; 
} 

<!DOCTYPE html> 
<html lang="es"> 
<head> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>@ViewBag.Title - Prueba WebCam</title> 
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /> 
    <meta name="viewport" content="width=device-width" /> 
    @Styles.Render("~/styles/base") 
    @Scripts.Render("~/scripts/jquery", "~/scripts/jqueryui", "~/scripts/webcam") 

    <script type="text/javascript"> 
     $(function() { 
      $("#camera").webcam({ 
       width: 320, 
       height: 240, 
       mode: "save", 
       swffile: "@Url.Content("~/Scripts/WebCam/jscam_canvas_only.swf")", 
       onTick: function() { }, 
       onSave: function() { alert('Almacenamiento realizado') }, 
       onCapture: function() { webcam.save("@Url.Action("Save")"); alert('Captura realizada'); }, 
       debug: function() { }, 
       onLoad: function() { } 
      }); 
     }); 

     function CaptureAndSave() { 
      webcam.capture(); 
     } 
    </script> 
</head> 
<body class="home desytec"> 
    <header> 
    </header> 
    <!-- MAIN --> 
    <div id="main"> 
     <!-- wrapper-main --> 
     <div class="wrapper"> 
      <!-- headline --> 
      <div class="clear"></div> 
      <div id="headline"> 
       <span class="main"></span> 
       <span class="sub"></span> 
      </div> 
      <!-- ENDS headline --> 

      <!-- content --> 
      <div id="content"> 
       <div id="camera"></div> 
       <br /><br /><br /> 
       <input type="button" onclick="CaptureAndSave();" value="Capturar" /> 
      </div> 
      <!-- ENDS content --> 
     </div> 
     <!-- ENDS wrapper-main --> 
    </div> 
    <!-- ENDS MAIN --> 
    <footer> 
    </footer> 
</body> 
</html> 

Ve bu denetleyici geçerli:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 

namespace Capture.Controllers 
{ 
    public class CaptureController : Controller 
    { 
     // 
     // GET: /Capture/ 

     public ActionResult Index() 
     { 
      return View(); 
     } 

     [HttpPost] 
     public JsonResult Save(HttpPostedFileBase file) 
     { 
      try 
      { 
       if (file != null) 
       { 
        string pic = System.IO.Path.GetFileName(file.FileName); 
        string path = System.IO.Path.Combine(Server.MapPath("~/Captures"), pic); 
        file.SaveAs(path); 
        return Json(true, JsonRequestBehavior.AllowGet); 
       } 
      } 
      catch 
      { 

      } 
      return Json(true, JsonRequestBehavior.AllowGet); 
     } 
    } 
} 
kumandanın

kaydet yöntemi denir ve aslında, kundakçı kullanarak asla olsun, hiçbir POST yapılır .

Bu arada. Kamera, tuvalde görebildiğim için çalışıyor (DIV id = kamera).

Ve OnCapture geri çağırma, yakalama düğmesine bastıktan sonra çağrılır.

Bu konuda herhangi bir yardım, lütfen? jscam_canvas_only.swf sadece "callback" modunu içerdiği için

Teşekkür Jaime

+0

bana yardım edebilir .. Kaydetme eylemine düzenli bir gönderi yapabilir misiniz? Yazılı olduğu şekilde yazılsın ve cURL ya da tarayıcınızın bazı uzantısını kullanarak eylem hakkında bazı veriler yayınlayın ve bir vuruş olup olmadığını görün. –

+0

Nemesv ... Üzgünüm. 3 saat sonra eve döndüğümde çözümü test edeceğim. Saygılarımızla. – jstuardo

cevap

1

Sizin Save eylem çağrılmaz. Tam API için ("save" modu için) indirmeniz ve jscam.swf'u kullanmanız gerekir.

Yani sizin webcam kurulumunu değiştirin:

$("#camera").webcam({ 
    //... 
    swffile: "@Url.Content("~/Scripts/WebCam/jscam.swf")", 
    //... 
}); 

jscam.swf isteği gövdesine onaltılık dize olarak görüntü verilerini göndermek çünkü Şimdi Save aksiyon, ancak file parametresi her zaman boş olacak çağrılır.

varsayılan model bağlama altyapısı bu işleyen değil

yüzden bazı ek kod yazmak gerekir : Bunu bir onaltılık olduğu için file parametresini kaldırabilir ve Request.InputStream ham verilere erişmek ancak gerek

if (Request.InputStream.Length > 0) 
{ 
    string pic = System.IO.Path.GetFileName("capture.jpg"); 
    string path = System.IO.Path.Combine(Server.MapPath("~/Captures"), pic); 
    using (var reader = new StreamReader(Request.InputStream)) 
    { 
     System.IO.File.WriteAllBytes(path, StringToByteArray(reader.ReadToEnd())); 
    } 
    return Json(true, JsonRequestBehavior.AllowGet); 
} 

dize kaydetmeden önce onu byte[]'a dönüştürmeniz gerekir.

Orada NET inşa varsayılan dönüşüm ancak SO iyi çözümleri dolu: Benim örnekte

How do you convert Byte Array to Hexadecimal String, and vice versa?

ben this method kullandım:

public static byte[] StringToByteArray(String hex) 
{ 
    int NumberChars = hex.Length/2; 
    byte[] bytes = new byte[NumberChars]; 
    using (var sr = new StringReader(hex)) 
    { 
    for (int i = 0; i < NumberChars; i++) 
     bytes[i] = 
     Convert.ToByte(new string(new char[2]{(char)sr.Read(), (char)sr.Read()}), 16); 
    } 
    return bytes; 
} 
+0

Teşekkürler !!!! Mükemmel çalıştı! – jstuardo