使用mvc5从浏览器在数据库中保存图像扫描仪

Question

嗨，我正在尝试将我从扫描仪扫描的图像保存到数据库中，图像会显示在浏览器中，但是我不知道如何在我的代码中将其保存在数据库中

这是JavaScript代码

   <script type="text/javascript">
            var selDiv = "";
            var storedFiles = [];

            $(document).ready(function () {
                selDiv = $("#selectedFiles");
                $("body").on("click", ".selFile", editFiles);
            });

            var start = function () {
                var i = 0;

                var wsImpl = window.WebSocket || window.MozWebSocket;

                window.ws = new wsImpl('ws://localhost:8181/');
                ws.onmessage = function (e) {
                    if (typeof e.data === "string") {
                        //IF Received Data is String
                    }
                    else if (e.data instanceof ArrayBuffer) {
                       //IF Received Data is ArrayBuffer
                    }
                    else if (e.data instanceof Blob) {

                        i++;

                        var f = e.data;

                        f.name = "File" + i;

                        storedFiles.push(f);

                        var reader = new FileReader();

                        reader.onload = function (e) {
                            var html = "<div class=\"col-sm-2 text-center\" style=\"border: 1px solid black; margin-left: 2px;\"><img height=\"200px\" width=\"200px\" src=\"" + e.target.result + "\" data-file='" + f.name + "' class='selFile' title='Click to remove'><br/>" + i + "</div>";
                            selDiv.append(html);

                        }
                        reader.readAsDataURL(f);
                    }
                };
                ws.onopen = function () {
                    //Do whatever u want when connected succesfully
                };
                ws.onclose = function () {
                    $('.dalert').modal('show');
                };
            }
            window.onload = start;

            function scanImage() {
                ws.send("1100");
            };

            function editFiles(e) {
                var file = $(this).data("file");
                for (var i = 0; i < storedFiles.length; i++) {
                    if (storedFiles[i].name === file) {
                        $('.scandetail').modal('show');
                        var c = document.getElementById("myCanvas");
                        var ctx = c.getContext("2d");
                        var img = new Image();
                        img.src = window.URL.createObjectURL(storedFiles[i]);
                        img.onload = function () {
                            c.width = img.width ;
                            c.height = img.height;
                            ctx.drawImage(img, 0, 0, img.width, img.height);
                        }
                        break;

                    }
                }
            };

    </script>

****这是我的作品****

 <button type="button"  onclick="scanImage();" class="btn btn-primary btn-lg">Scan</buton>
                    <div id="selectedFiles" class="row" style="padding:3px;overflow-x: scroll;display: flex;"></div>
                    <div class="modal fade scandetail" role="dialog">
                        <div class="modal-dialog modal-lg" role="document">
                            <div class="modal-content">
                                <div style="max-height:1200px;overflow:scroll;">
                                    <canvas id="myCanvas"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>

这是我的控制器

public async Task<ActionResult> Create(Inbox model)
{

    var currentUser = await manager.FindByIdAsync(User.Identity.GetUserId());
    if (ModelState.IsValid)
    {
        model.User = currentUser;

        List<FileDetail> fileDetails = new List<FileDetail>();
        for (int i = 0; i < Request.Files.Count; i++)
        {
            var file = Request.Files[i];

            if (file != null && file.ContentLength > 0)
            {
                var fileName = Path.GetFileName(file.FileName);
                FileDetail fileDetail = new FileDetail()
                {
                    FileName = fileName,
                    Extension = Path.GetExtension(fileName),
                    Id = Guid.NewGuid()
                };
                fileDetails.Add(fileDetail);

                var path = Path.Combine(Server.MapPath("~/FilesAPP/"), fileDetail.Id + fileDetail.Extension);
                file.SaveAs(path);
            }
        }



        model.FileDetails = fileDetails;
        db.Inboxs.Add(model);
        db.SaveChanges();
        string url = Url.Action("List");
        return Json(new { success = true, url = url });
    }

    return View(model);
}

如何将在浏览器中扫描的图像保存到数据库人员中