MVC捕获网络摄像头图像,将图像的文件路径保存到数据库

时间:2016-11-02 01:24:12

标签: asp.net-mvc asp.net-mvc-4 webcam-capture

以下是我想要实现的目标:

  • 从“编辑”视图中捕获网络摄像头图像。 (工作)
  • 为图像指定文件名和路径。 (工作)
  • 将图像保存到images文件夹。 (工作)
  • 将路径存储到数据库中。 (不工作)

这是我的Capture控制器:

      public void Capture(String FileLocation)
    {
        //var FileLocation = Server.MapPath("~/Images/test.jpg");
        var stream = Request.InputStream;
        string dump;

        using (var reader = new StreamReader(stream))
            dump = reader.ReadToEnd();


        if (System.IO.File.Exists(FileLocation))
        {
            System.IO.File.Delete(FileLocation);
            System.IO.File.WriteAllBytes(FileLocation, String_To_Bytes2(dump));
        }
        else System.IO.File.WriteAllBytes(FileLocation, String_To_Bytes2(dump));


        return;

    }

这是编辑控制器:

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Edit(TrappingEvent trappingevent)
    {

        if (ModelState.IsValid)
        {


            db.Entry(trappingevent).State = EntityState.Modified;
            db.SaveChanges();

            return RedirectToAction("Index");
        }

        ViewBag.PersonId = new SelectList(db.People, "Id", "First_Name", trappingevent.PersonId);
        return View(trappingevent);
    }

根据我的有限理解,将文件路径作为变量从Capture void传递给控制器​​以绑定到模型会很好。

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

它的工作!好吧,我以迂回的方式做到了,仍然很高兴听到建议。

继承人的要点:

  • 当我点击捕获按钮时,我运行了以下功能:

    function CaptureAndAssignText() {
    var Div = document.getElementById("ImagePath");//ImagePath is the field
    // I want to bind to the model.
    
    newText = "ID_" + @Model.Id + ".jpg";//Here I grab the Id of 
    //the current model to use as the file name
    
    Div.value = newText;//Assign the file name to the input 
    //field ready for submission.
    
    webcam.capture();//Run the capture function
    }
    
  • 这是捕获功能(相当标准 - 有人可以告诉我,我是否需要准备好文件?)

    $(document).ready(function () {
                            $("#Camera").webcam({
                                width: 320,
                                height: 240,
                                mode: "save",
                                swffile: "@Url.Content("~/Scripts/jscam.swf")",
                                onTick: function () { },
                                onSave: function () {
                                },
                                onCapture: function () {
                                    webcam.save("@Url.Action("Capture", "TrapActivity", new { id = @Model.Id , pid = @Model.PersonId})");
                                },
                                debug: function () { },
                                onLoad: function () { }
                            });
                       });
    

这是我的控制器,经过修改后接受模型ID作为字符串(包括String to Bytes函数以便于参考):

    public ActionResult Capture(string ID)
    {
        var path = Server.MapPath("~/Images/ID_" + ID + ".jpg" );

        //var path1 = "~/Images/test.jpg;";



        var stream = Request.InputStream;
        string dump;

        using (var reader = new StreamReader(stream))
            dump = reader.ReadToEnd();


        if (System.IO.File.Exists(path))
        {
            System.IO.File.Delete(path);
            System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump));
        }
        else System.IO.File.WriteAllBytes(path, String_To_Bytes2(dump));


        return View(ID);

    }

    private byte[] String_To_Bytes2(string strInput)
    {
        int numBytes = (strInput.Length) / 2;
        byte[] bytes = new byte[numBytes];

        for (int x = 0; x < numBytes; ++x)
        {
            bytes[x] = Convert.ToByte(strInput.Substring(x * 2, 2), 16);
        }

        return bytes;
    }

现在一旦点击了捕获。表单可以像提交强类型表单一样提交。

此方法存在潜在问题

  • 这种方式只允许存储一个图像。
  • 我以一种非常奇怪的方式存储文件路径。

我不仅仅接受建议。