VintaSoft Twain .NET SDK v10.2
Acquire images from scanner in ASP.NET MVC

1. Scanning, viewing and processing images in ASP.NET MVC application

The process of scanning image, viewing and processing of scanned image in ASP.NET MVC application may be divided into the following stages:
  1. Scanning image and obtaining information about scanned image.
  2. Viewing and processing scanned image, if necessary.
  3. Saving scanned image to the local computer, if necessary.
  4. Saving scanned image to the server, if necessary.

1.1. Scanning image and obtaining information about scanned image

Asynchronous image acquisition from scanner (TWAIN device) may be divided into the following steps:

1.1.1. Local web service for acquiring images from scanner

Depending on application architecture the local web service, which acquires images from scanner, can be based on Web API 2 controller, Web API controller or WCF service.
The SDK provides the following ready-to-use web services:

Important: Vintasoft.Twain.dll, Vintasoft.Shared.dll and Vintasoft.Shared.Web.dll assemblies are necessary for correct work of Vintasoft.Twain.Web.Api2Controllers.dll, Vintasoft.Twain.Web.ApiControllers.dll or Vintasoft.Twain.Web.WcfServices.dll assembly.

1.1.2. JavaScript code for acquiring images from scanner

The WebTwainDeviceManagerJS and WebTwainDeviceJS classes, from Vintasoft.Twain.js file, can be used on a client-side of ASP.NET MVC application for image acquisition from a TWAIN device.

WebTwainDeviceManagerJS class allows to:
WebTwainDeviceJS class allows to:

Important: Important: JQuery (version 1.11 or higher) and Vintasoft.Shared.js file are necessary for correct work of Vintasoft.Twain.js file.

Example: Here is an example that demonstrates how to acquire images from the default TWAIN device in JavaScript:
// a Web API controller that allows to work with TWAIN devices
var _twainService = new Vintasoft.Shared.WebServiceControllerJS('http://localhost:25319/api/VintasoftTwainApi');
// TWAIN device manager
var _twainDeviceManager = new Vintasoft.Twain.WebTwainDeviceManagerJS(_twainService);
// the default settings of TWAIN device manager
var deviceManagerInitSetting = new Vintasoft.Twain.WebTwainDeviceManagerInitSettingsJS();
// send a request for opening TWAIN device manager
_twainDeviceManager.open(deviceManagerInitSetting, __openDeviceManager_success, error_callback);

// TWAIN device manager is opened successfully.
function __openDeviceManager_success() {
    // send a request for getting information about TWAIN devices available in the system
    _twainDeviceManager.getDevices(__getDeviceInfos__success, error_callback);
}

// Information about TWAIN devices is received successfully.
function __getDeviceInfos__success(data) {
    // get an array of available TWAIN devices
    var devices = data.devices;
    // get index of default TWAIN device
    var defaultDeviceIndex = data.defaultDeviceIndex;
    // get the default TWAIN device
    var defaultTwainDevice = devices[defaultDeviceIndex];
    // send a request for opening the default TWAIN device
    defaultTwainDevice.open(true, __openDevice__success, error_callback);
}
                                        
// TWAIN device is opened successfully.
function __openDevice__success(data) {
    // send a request for acquiring images from TWAIN device
    __acquireModal();
}

// Sends a request for acquiring images from TWAIN device.
function __acquireModal() {
    // get opened TWAIN device
    var device = _twainDeviceManager.get_OpenDevice();
    // if device is found
    if (device != undefined) {
        // send a request for acquiring images from TWAIN device
        device.acquireModal(__acquireModal_success, error_callback);
    }
}

// One step of synchronous image acquisition is executed successfully.
function __acquireModal_success(data) {
    // get state of image acquisition
    var acquireModalState = data.acquireModalState;
    switch (acquireModalState) {
        case 2:   // image is acquired
            // send a request for getting information about image
            __getImageInfo(data.imageId);
            // send a request for getting an image thumbnail
            __getImageThumbnail(data.imageId);
            break;
        case 4:   // scan is failed
            alert(data.errorMessage);
            break;
        case 8:   // image acquiring is in progress
            console.log("Image acquiring progress: " + data.imageAcquiringProgressValue);
            break;
        case 9:   // scan is finished
            break;
    }
    // if image acquisition must be continued
    if (acquireModalState !== 0)
        // send a request for acquiring images from TWAIN device
        __acquireModal();
    // if image acquisition must be finished
    else {
        // send a request for closing TWAIN device, TWAIN device manager and TWAIN session                                                                          
        _twainDeviceManager.close(__closeDeviceManager_success, error_callback);
    }
}

// Sends a request for getting information about image.
function __getImageInfo(imageId) {
    var ajaxParams = {
        type: 'POST',
        data: {
            twainSessionId: _twainDeviceManager.get_TwainSessionID(),
            imageId: imageId,
        }
    }
    var request = new Vintasoft.Shared.WebRequestJS("GetImageInfo", __getImageInfo_success, __showErrorMessage, ajaxParams);
    _twainService.sendRequest(request);
}

// Image information is received successfully.
function __getImageInfo_success(data) {
    // get the image identifier
    var imageId = data.imageId;
    // get the image size
    var imageSize = { width: data.imageWidth, height: data.imageHeight };
}

// Sends a request for getting an image thumbnail.
function __getImageThumbnail(imageId) {
    var ajaxParams = {
        type: 'POST',
        data: {
            twainSessionId: _twainDeviceManager.get_TwainSessionID(),
            imageId: imageId,
            thumbnailWidth: 350,
            thumbnailHeight: 270
        }
    }
    var request = new Vintasoft.Shared.WebRequestJS("GetThumbnail", __getImageThumbnail_success, __showErrorMessage, ajaxParams);
    _twainService.sendRequest(request);
}

// An image thumbnail is received successfully.
function __getImageThumbnail_success(data) {
    // get the image identifier
    var imageId = data.imageId;
    // get an image thumbnail as Base64 string
    var imageThumbnailAsBase64String = "data:image/png; base64," + data.imageAsBase64String;
}

// TWAIN device manager is closed successfully.
function __closeDeviceManager_success(data){
    alert("Device manager is closed.");
}

// Error occurs.
function error_callback(data){
    // our action with twain service was failed and error message exist
    if (data.errorMessage)
        alert(data.errorMessage);
    // error message does not exist - service not available etc
    else
        // handle error
}
        

1.2. Viewing and processing scanned image

For working with scanned image (rendering of image tiles, rendering of thumbnail, image processing), which is still being stored in the web service on local computer, it is necessary to follow either of two ways:
  1. Load the scanned image onto the server and process it on server-side of web application
  2. Do not load the scanned image onto the server and process it using the local web service

The first way (processing image on server) is simple, but has disadvantage - each scanned image must be transferred onto server for viewing and processing, even if the image become unnecessary after viewing and processing. The speed of image transfer through the network depends on network overall transmission speed, so sometimes transferring a big image could take long and unacceptable amount of time.

The second way (processing image using a local web service) is not so simple, but it has the following advantages:

Viewing and processing scanned image using a local web service may be divided into the following steps:

1.2.1. Local web service for processing scanned images

VintaSoft Twain .NET SDK provides some basic functions for processing of scanned images. The functions of the SDK are implemented via .NET code. The SDK does not provide a ready-to-use web service, thus you can create the web service by yourself or use the web service MyVintasoftTwainApiController from VintasoftWebApiTwainService demo application (is a part of the evaluation distributive package of VintaSoft Twain .NET SDK).

VintaSoft Imaging .NET SDK provides professional functions for image processing and annotating.
The article describing how to process images in ASP.NET MVC using VintaSoft Imaging .NET SDK is located here.
Sample web services for image processing can be seen in VintasoftWebApiTwainAdvancedService demo application (is a part of the evaluation distributive package of VintaSoft Imaging .NET SDK).

VintaSoft Barcode .NET SDK provides the ability to recognize barcodes from images.
The article describing how to recognize barcodes from images in ASP.NET MVC using VintaSoft Barcode .NET SDK is located here.
Sample web services for barcode recognition from scanned images can be seen in VintasoftWebApiTwainAdvancedService demo application (is a part of the evaluation distributive package of VintaSoft Imaging .NET SDK).

1.2.2. JavaScript code for processing scanned images using local web service

For working with a web service, which processes images using functions of VintaSoft Twain .NET SDK, you need to create JavaScript code by yourself or use JavaScript code from AspNetMvc4TwainDemos demo application (is a part of the evaluation distributive package of VintaSoft Twain .NET SDK).

For working with a web service, which processes images using functions of VintaSoft Imaging .NET SDK, it is necessary to use JavaScript classes (WebChangePixelFormatCommandJS, WebCropCommandJS, WebResizeCommandJS, WebRotateCommandJS, WebDeskewCommandJS, ...) from file Vintasoft.Imaging.Html5.js.
The article describing how to process images in ASP.NET MVC using VintaSoft Imaging .NET SDK is located here.
The code examples can be seen in AspNetMvc4Demos demo application (is a part of the evaluation distributive package of VintaSoft Imaging .NET SDK).

For working with a web service, which recognizes barcodes using functions of VintaSoft Barcode .NET SDK, it is necessary to use JavaScript class WebBarcodeReaderJS from file Vintasoft.Barcode.js.
The article describing how to recognize barcodes from images in ASP.NET MVC using VintaSoft Barcode .NET SDK is located here.
The code examples can be seen in AspNetMvc4Demos demo application (is a part of the evaluation distributive package of VintaSoft Imaging .NET SDK).

1.3. Saving scanned image to the local computer

The scanned image can be easily saved to the local computer, as the scanned image is stored in the web service on local computer.

Saving of acquired image to the local computer can be divided into the following steps:

1.4. Saving scanned image to the server

If the scanned image was previously uploaded to server, then the saving of scanned image to server may be divided into the following steps:

If the scanned image was NOT previously uploaded to server, then the saving of scanned image to server may be divided into the following steps:

2. Demo applications

VintaSoft provides 2 sets of demo applications intended for scanning, viewing and processing images in ASP.NET MVC:
  1. Demo applications based only on functionality of VintaSoft Twain .NET SDK.
  2. Demo applications based on functionality of VintaSoft Twain .NET SDK, VintaSoft Imaging .NET SDK and VintaSoft Barcode .NET SDK.

2.1. Demo applications based only on functionality of VintaSoft Twain .NET SDK

AspNetMvc4TwainDemos and VintasoftWebApiTwainService projects are part of the evaluation distributive package of VintaSoft Twain .NET SDK.

The AspNetMvc4TwainDemos project contains the ASP.NET MVC 4 demo, which demonstrates how to implement an asynchronous image acquisition from scanner using the web service based on Web API controller.

WinForms application VintasoftWebApiTwainService allows to run a local self-hosted web service, which is based on Web API controller, for scanner management.

AspNetMvc4TwainDemos and VintasoftWebApiTwainService projects must be run together, because the VintasoftWebApiTwainService project supports the work of scanning functionality for AspNetMvc4TwainDemos project.

The SDK also includes projects for ASP.NET MVC 5: AspNetMvc5TwainDemos and VintasoftWebApi2TwainService.

2.2. Demo applications based on functionality of VintaSoft Twain .NET SDK, VintaSoft Imaging .NET SDK and VintaSoft Barcode .NET SDK

AspNetMvc4Demos and VintasoftWebApiTwainAdvancedService projects are part of the evaluation distributive package of VintaSoft Imaging .NET SDK.

The AspNetMvc4Demos project includes the ASP.NET MVC 4 demos, which demonstrate how to implement an asynchronous image acquisition from scanner using the web service based on Web API controller. Also the demos show how to view, process and annotate scanned image, and how to recognize barcodes from scanned image.

WinForms application VintasoftWebApiTwainAdvancedService is an example of local self-hosted web service based on Web API controller. The local self-hosted web service provides the following abilities:

VintasoftWebApiTwainAdvancedService project stores the scanned images on local computer and allows to view and process scanned images before sending them to server.

VintasoftWebApiTwainAdvancedService project is provided with source codes, thus you can extend the service functionality, for example, the files with scanned images can be secured, the scanned images can be stored in memory instead of disk, new image processing functions can be added and many many more.

AspNetMvc4Demos and VintasoftWebApiTwainAdvancedService projects must be run together, because the VintasoftWebApiTwainAdvancedService project project supports the work of scanning and image processing functionality for AspNetMvc4Demos project.

The SDK also includes projects for ASP.NET MVC 5: AspNetMvc5Demos and VintasoftWebApi2TwainAdvancedService.

3. Installing and running the local web service

For installing and running the local web service onto a local computer it is necessary to create the installer for the local web service. The installer should perform the following steps:
You can create the installer by yourself or use the one created and provided by VintaSoft.

3.1. Use Vintasoft installer for installing and running the local web service based on VintasoftWebApiTwainService project

The installer created by VintaSoft for VintasoftWebApiTwainService project:

The usage of VintaSoft installer significantly simplifies and speeds up the process of implementation the scanning functionality into your ASP.NET MVC application.
The VintaSoft installer, intended only for evaluation purposes, is available for download from this link: https://www.vintasoft.com/zip/VSWebTwainService1_2.zip
Please contact VintaSoft Support Service at support@vintasoft.com in case you have purchased the appropriate license and want to get the VintaSoft installer to use in production.

3.1. Use Vintasoft installer for installing and running the local web service based on VintasoftWebApiTwainAdvancedService project

The installer created by VintaSoft for VintasoftWebApiTwainAdvancedService project:
The usage of VintaSoft installer significantly simplifies and speeds up the process of implementation the scanning functionality into your ASP.NET MVC application.
The VintaSoft installer, intended only for evaluation purposes, is available for download from this link: https://www.vintasoft.com/zip/VSWebTwainAdvancedService1_5.zip
Please contact VintaSoft Support Service at support@vintasoft.com in case you have purchased the appropriate license and want to get the VintaSoft installer to use in production.