VintaSoft Barcode .NET SDK 16.0: Documentation for Web developer
In This Topic
Recognize barcodes in image in ASP.NET WebForms application
In This Topic
This tutorial shows how to create a blank ASP.NET WebForms application in Visual Studio .NET 2019 and recognize barcodes in image in ASP.NET WebForms application.

Here are steps, which must be done:
  1. Create a blank ASP.NET WebForms application.

    Open Visual Studio .NET 2019 and create a new project, of ASP.NET Web application type, and configure the project to use .NET Framework 4.7.2:

    Select the "Empty" template for ASP.NET Web application and configure the project to use WebForms:

  2. Server side: Add references to the Vintasoft nuget-packages to ASP.NET WebForms application.

    Add references to the nuget-packages Vintasoft.Barcode and Vintasoft.Barcode.Web.HttpHandlers to the ASP.NET WebForms application.

  3. Server side: Add generic handler, which allows to recognize barcodes in image, to ASP.NET WebForms application.

    • Add the "Handlers" folder to ASP.NET WebForms application.
    • Press the right mouse button on the "Handlers" folder and select the "Add => New Item..." menu from context menu
    • Select "Generic Handler" template, set the handler name to the "MyVintasoftBarcodeHandler" and press the "Add" button
    • Specify that MyVintasoftBarcodeHandler class is derived from Vintasoft.Barcode.Web.HttpHandlers.VintasoftBarcodeHandler class

      Here are C# source codes of MyVintasoftBarcodeHandler class:
      namespace WebApplication1.Handlers
      {
          /// <summary>
          /// Summary description for MyVintasoftBarcodeHandler
          /// </summary>
          public class MyVintasoftBarcodeHandler : Vintasoft.Barcode.Web.HttpHandlers.VintasoftBarcodeHandler
          {
      
              public bool IsReusable
              {
                  get
                  {
                      return false;
                  }
              }
      
          }
      }
      
  4. Client side: Add Vintasoft JavaScript files to the project.

  5. Client side: Add JavaScript code, which recognizes barcodes and displays barcode recognition result, to the Default web form.

    • Create folder "UploadedImageFiles\SessionID" and copy PNG-image file with barcodes from Github to the folder. We will recognize barcodes in this image.
    • Create the Default web form - file "Default.aspx".
      • Press the right mouse button on the project and select the "Add => WebForm" menu from context menu:
      • Specify "Default" as web form name => created web form will be opened:
    • Add references to Vintasoft JavaScript files:

      Here is HTML code that adds references to Vintasoft JavaScript files:
      <script src="~/Scripts/Vintasoft.Shared.js" type="text/javascript"></script>
      <script src="~/Scripts/Vintasoft.Barcode.js" type="text/javascript"></script>
      
      
    • Add HTML markup (a div element that will display barcode recognition result) to the web view:

      Here is HTML markup code:
      <div id="barcodeInformation"></div>
      
    • Add JavaScript code that recognizes barcodes and displays barcode recognition result:

      Here is JavaScript code that recognizes barcodes and displays barcode recognition result:
      <script type="text/javascript">
      
          /**
           * Barcodes are recognized successfully.
           */
          function __readBarcodes_success(data) {
              if (data.success) {
                  // get the barcode recognition result
                  var barcodeRecognitionResults = data.results;
      
                  var htmlMarkup = '';
                  // if no barcodes found
                  if (barcodeRecognitionResults.length == 0) {
                      htmlMarkup = 'No barcodes found.';
                  }
                  // if barcodes are found
                  else {
                      htmlMarkup = barcodeRecognitionResults.length.toString() + ' barcodes are found.<br />';
                      htmlMarkup += '<br />';
      
                      // for each recognized barcode
                      for (var i = 0; i < barcodeRecognitionResults.length; i++) {
                          // get the barcode recognition result
                          var barcodeRecognitionResult = barcodeRecognitionResults[i];
      
                          // output information about recognized barcode
                          htmlMarkup += '[' + (i + 1) + ':' + barcodeRecognitionResult.barcodeType + ']<br />';
                          htmlMarkup += '  Value: ' + barcodeRecognitionResult.value + '<br />';
                          htmlMarkup += '  Confidence: ' + barcodeRecognitionResult.confidence + '<br />';
                          htmlMarkup += '  Reading quality: ' + barcodeRecognitionResult.readingQuality.toFixed(2) + '<br />';
                          htmlMarkup += '  Threshold: ' + barcodeRecognitionResult.threshold + '<br />';
                          htmlMarkup += '  Region: ' +
                              'LT=(' + barcodeRecognitionResult.region.leftTop.x + ',' + barcodeRecognitionResult.region.leftTop.y + '); ' +
                              'RT=(' + barcodeRecognitionResult.region.rightTop.x + ',' + barcodeRecognitionResult.region.rightTop.y + '); ' +
                              'LB=(' + barcodeRecognitionResult.region.leftBottom.x + ',' + barcodeRecognitionResult.region.leftBottom.y + '); ' +
                              'RB=(' + barcodeRecognitionResult.region.rightBottom.x + ',' + barcodeRecognitionResult.region.rightBottom.y + '); ' +
                              'Angle=' + barcodeRecognitionResult.region.angle.toFixed(1) + '°<br />';
      
                          htmlMarkup += '<br />';
                      }
                  }
      
                  var barcodeInformationElement = document.getElementById("barcodeInformation");
                  barcodeInformationElement.innerHTML = htmlMarkup;
              }
          }
      
          /**
           * Barcode recognition is failed.
           */
          function __readBarcodes_fail(data) {
              // show information about error
              alert(data.errorMessage);
          }
      
      
          // set the session identifier
          Vintasoft.Shared.WebImagingEnviromentJS.set_SessionId("SessionID");
      
          // create HTTP handler that allows to recognize barcodes in image
          var barcodeService = new Vintasoft.Shared.WebServiceHandlerJS("/Handlers/MyVintasoftBarcodeHandler.ashx");
      
          // create the barcode reader
          var barcodeReader = new Vintasoft.Barcode.WebBarcodeReaderJS(barcodeService);
          // specify that Code39 barcode must be searched
          barcodeReader.get_Settings().set_BarcodeType(new Vintasoft.Barcode.WebBarcodeTypeEnumJS("Code39"));
      
          // create web image that references to a file "AllSupportedBarcodes.png" in directory "/UploadedImageFiles/SessionID/"
          var imageSource = new Vintasoft.Shared.WebImageSourceJS("AllSupportedBarcodes.png");
          var image = new Vintasoft.Shared.WebImageJS(imageSource, 0);
      
          // send an asynchronous request for barcode recognition
          barcodeReader.readBarcodes(image, this.__readBarcodes_success, this.__readBarcodes_fail);
      </script>
      
      
  6. Run the ASP.NET WebForms application and see the result.