Read barcode via camera in an ASP.NET MVC 5 Application

Question

I have created a web site with ASP.NET MVC 5. This web site is also available on mobile devices as a web app. But now I want to add the possibility for the user to scan barcodes with the mobile camera when they are using the app on their mobiles. Of course there are tools like phonegap that enable read barcodes, but the point is I want to add this functionality in my ASP.NET MVC 5 project.
So is there a way to read barcodes via the mobile camera in ASP.NET MVC 5?

Answer 1

I have edited code for to use Aspose.BarCode package ;

   public JsonResult ScanDelivered(HttpPostedFileBase file)
    {
        string readedBarcode = "";
        try
        {
            string path = "";
            if (file.ContentLength > 0)
            {
                var fileName = Path.GetFileName(file.FileName);
                path = Path.Combine(Server.MapPath("~/App_Data"), fileName);
                file.SaveAs(path);
            }

          
            System.Drawing.Image img = System.Drawing.Image.FromFile(path);
            System.Diagnostics.Debug.WriteLine("Width:" + img.Width + " - Height:" + img.Height);

            try
            {
                // Initialize barcode reader
                using (BarCodeReader reader = new BarCodeReader(path, DecodeType.AllSupportedTypes))
                {
                    // Recognize barcodes on the image
                    foreach (var barcode in reader.ReadBarCodes())
                    {
                       
                        readedBarcode = barcode.CodeText;
                    }
                }

            }

            catch (Exception exp)
            {

                System.Console.Write(exp.Message);
            }


        }
        catch (Exception ex)
        {
            ViewBag.Title = ex.Message;
        }
        return Json(readedBarcode);


    }

Answer 2

I have solved this issue and here is the solution: In the view (Index.chtml):

     <form>
            <input type="file" class="upload" size="45" name="file" id="file">
    </form>

It is important to write the <input type="file"...> in a form tag. Next I use the javascript. I use it because I want to call the controller as soon as the Browse button is clicked. You can use a submit button, too.
Javascript:

       $('#file').on("change", function () {
        for (i = 0; i < $('form').length; i++) {
            if ($('form').get(i)[0].value != "") /* get the file tag, you have to customize this code */
            {
                var formdata = new FormData($('form').get(i));
                CallService(formdata);
                break;
            }
        }
    });
    function CallService(file) {
        $.ajax({
            url: '@Url.Action("Scan", "Home")',
            type: 'POST',
            data: file,
            cache: false,
            processData: false,
            contentType: false,
            success: function (barcode) {
                alert(barcode);
            },
            error: function () {
                alert("ERROR");
            }
        });
    }

Next we have have analyse the image in the server and read the barcode of it. I am using the Aspose.BarCode Library:
HomeController.cs

        public JsonResult Scan(HttpPostedFileBase file)
    {
        string barcode = "";
        try
        {
            string path = "";
            if (file.ContentLength > 0)
            {
                var fileName = Path.GetFileName(file.FileName);
                path = Path.Combine(Server.MapPath("~/App_Data"), fileName);
                file.SaveAs(path);
            }

            // Now we try to read the barcode
            // Instantiate BarCodeReader object
            BarCodeReader reader = new BarCodeReader(path, BarCodeReadType.Code39Standard);
            System.Drawing.Image img = System.Drawing.Image.FromFile(path);
            System.Diagnostics.Debug.WriteLine("Width:" + img.Width + " - Height:" + img.Height);

            try
            {
                // read Code39 bar code
                while (reader.Read())
                {

                    // detect bar code orientation
                    ViewBag.Title = reader.GetCodeText();
                    barcode = reader.GetCodeText();
                }
                reader.Close();
            }

            catch (Exception exp)
            {

                System.Console.Write(exp.Message);
            }


        }
        catch (Exception ex)
        {
            ViewBag.Title = ex.Message;
        }
        return Json(barcode);


    }
}

Now the decoded barcode is returned to the view.