C# ASP.Net jQuery网络摄像头映像到数据库varbinary（最大值）

我已经编写了从网络摄像头捕获图像的Javascript，然后我想将其序列化到我的SQL Server数据库。数据库中的字段是通常的varbinary（max）。我可以从firebug中看到，原始图像正在传递给我的web方法，但它不断抛出以下错误：

“插入'797719006-'失败：Telerik.OpenAccess.RT.sql.SQLException:无法将值NULL插入列'Picture'，表'GoldStar.Students.Pictures'

捕获图像的javascript确实工作得很好，所以我知道这没有问题，只需将其保存到数据库中即可。也许我通过ajax使用web方法进行更新会使事情变得过于复杂

我在我的注册页面上创建了一个启用web的方法，它如下所示：

    [WebMethod(EnableSession = true)]
    public static void UpdatePicture(object picture)
    {
        //Check if the user already has a picture in the database.
        using (var dataContext = new DAL.GoldStarModel())
        {
            var userPictures = (from p in dataContext.Pictures
                                where p.UserId == (Guid) Membership.GetUser().ProviderUserKey
                                select p);

            if (userPictures.Count() > 0)
            {
                //If user already has a picture then update.
                userPictures.First().Picture = picture as byte[];
            }
            else
            {
                //If User does NOT have a picture then add one.
                dataContext.Add(new Students.Pictures()
                                    {
                                        UserId = (Guid) Membership.GetUser().ProviderUserKey,
                                        Picture = picture as byte[],
                                        CreationDate = DateTime.Now

                                    });
            }

            dataContext.SaveChanges();
        }

相关Javascript如下所示：

                var canvas = document.getElementById("canvas");
                var profilePic = $('#profilePic')

                $('#webcam').hide();

                try {
                    //Update the profile picture in the parent.
                    var currentPic = self.parent.document.getElementById('MainContent_UserFormView_RegisterUser_StudentPicture');

                    var oldWidth = Number(currentPic.width);
                    var oldHeight = Number(currentPic.height);

                    currentPic.src = canvas.toDataURL();

                    currentPic.width = oldWidth;
                    currentPic.height = oldHeight;

                    profilePic.show();

                    $.ajax({
                        type: "POST",
                        url: "/Account/Register.aspx/UpdatePicture",
                        contentType: "application/json; charset=utf-8",
                        data: "{'picture': '" + currentPic.src + "'}",
                        dataType: "json",
                        success: function (result) {
                            //ApplyTemplate(result)
                        }
                    });
                }

---

您是否使用了fiddler之类的工具来检查线路上发生了什么，因为乍一看，这只是图像的字符串路径，而不是图像数据

在服务器上，您不能仅从对象强制转换为字节数组，除非您已经获得了字节数组，在这种情况下，请将其用作类型。同样，从您的代码来看，jquery不太可能将二进制数据数组传递给您的方法

我怀疑你需要Silverlight或Flash之类的东西来上传图像数据。html沙盒在向服务器发送文件数据时非常困难

更新

您需要解析该字符串。您拥有所需的一切，这很好。您需要查找base64字符串的起始位置。获取该base64字符串并使用Convert.FromBase64String，它将为您提供一个字节数组，即您的图像。将其存储在数据库中

---

我会将您的webmethod更改为接受字符串，因为这是画布生成的内容。所有这些都应该可以工作。

您是否使用了类似fiddler的工具来检查线路上的内容，因为乍一看，它只是图像的字符串路径，而不是图像数据

在服务器上，您不能仅从对象强制转换为字节数组，除非您已经获得了字节数组，在这种情况下，请将其用作类型。同样，从您的代码来看，jquery不太可能将二进制数据数组传递给您的方法

我怀疑你需要Silverlight或Flash之类的东西来上传图像数据。html沙盒在向服务器发送文件数据时非常困难

更新

您需要解析该字符串。您拥有所需的一切，这很好。您需要查找base64字符串的起始位置。获取该base64字符串并使用Convert.FromBase64String，它将为您提供一个字节数组，即您的图像。将其存储在数据库中

---

我会将您的webmethod更改为接受字符串，因为这是画布生成的内容。所有这些都应该可以工作。

您是否使用调试器在服务器端浏览了代码？很快，它看起来像是从对象到字节的转换[]失败。是的，这正是它失败的地方。这就是问题所在，我似乎不知道如何将javascript HtmlImageElement或原始图像数据（currentPic.src）序列化为一个字节[]，以便存储在db中。我在谷歌上搜索过，但还没有发现任何相关内容。我正在对字节[]进行的安全转换这只是暗中捅了一刀，造成了我想象中的破坏。您是否使用调试器在服务器端浏览了代码？很快，它看起来像是从对象到字节的转换[]失败。是的，这正是它失败的地方。这就是问题所在，我似乎不知道如何将javascript HtmlImageElement或原始图像数据（currentPic.src）序列化为一个字节[]，以便存储在db中。我在谷歌上搜索过，但还没有发现任何相关内容。我正在对字节[]进行的安全转换是的，我正在使用Firebug来查看背景中发生了什么。如果您仔细观察，.src在本例中不是图像的字符串路径，因为它被设置为canvas.toDataURL（），看起来像：“data:image/png；base64，ivborw0kggoaaaansuhueu…“我完全不知道如何做一些有意义的事情。是的，我使用Firebug来查看背景中发生了什么。如果你仔细看的话，.src在本例中不是图像的字符串路径，因为它被设置为canvas.toDataURL（），看起来像：“data:image/png；base64，Ivborw0kggoaaansuhuu…“我完全不知道如何做一些有意义的事情。