VintaSoft Twain .NET SDK 15.1: Документация для Веб разработчика
В этом разделе
    Получение изображений от TWAIN/SANE сканера в ASP.NET Core приложении
    В этом разделе
    В этом руководстве показано, как создать пустое веб-приложение ASP.NET Core в Visual Studio .NET 2022 и получить изображения от TWAIN или SANE сканера в ASP.NET Core приложении.
    Вот действия, которые необходимо выполнить:
    1. Создайте пустое ASP.NET Core Web приложение.

      Откройте Visual Studio .NET 2022 и создайте новый проект приложения типа ASP.NET Core Web:

      Сконфигурируйте проект для использования .NET 7.0:

    2. Серверная сторона: Добавьте контроллер MVC по умолчанию в ASP.NET Core Web приложение.

      • Добавьте папку "Controllers" к проекту.
      • Правой кнопкой мыши нажмите на папку "Controllers" и выберите пункт "Add => Controller..." из контекстного меню
      • Используйте шаблон "MVC Controller - Empty", нажмите кнопку "Добавить", установите имя контроллера как "HomeController" и нажмите кнопку "Добавить"
      • Откройте файл "Startup.cs", включите обслуживание статических файлов и добавьте созданный контроллер MVC к конечным точкам ASP.NET Core приложения:

        Добавьте контроллеры с представлениями к службам ASP.NET Core приложения:

        Вот исходные C# коды файла Startup.cs:
        using Microsoft.AspNetCore.Builder;
        using Microsoft.AspNetCore.Hosting;
        using Microsoft.Extensions.DependencyInjection;
        using Microsoft.Extensions.Hosting;
        
        namespace WebApplication1
        {
            public class Startup
            {
                // This method gets called by the runtime. Use this method to add services to the container.
                // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
                public void ConfigureServices(IServiceCollection services)
                {
                    services.AddControllersWithViews();
                }
        
                // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
                public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
                {
                    if (env.IsDevelopment())
                    {
                        app.UseDeveloperExceptionPage();
                    }
        
                    app.UseStaticFiles();
                    app.UseRouting();
        
                    app.UseEndpoints(endpoints =>
                    {
                        endpoints.MapControllerRoute("default", "{controller=Default}/{action=Index}/{id?}");
                    });
                }
            }
        }
        
        
    3. Серверная сторона: Создайте веб-представление для отображения изображения, полученного от TWAIN/SANE сканера.

    4. Откройте файл "HomeController.cs", правой кнопкой мыши нажмите на метод "Index" класса DefaultController и выберите пункт "Add View..." из контекстного меню
    5. Выберите шаблон "Razor View - Empty", нажмите кнопку "Add", Установите вид в "Index" и нажмите кнопку "Add" => "Views\Home\Index.cshtml" файл будет создан
    6. Клиентская сторона: Добавьте инсталлятор VintaSoft Web TWAIN сервиса в ASP.NET Core Web приложение.

      • Добавьте папку "Data" в папку "wwwroot".
      • Если веб приложение будет использоваться в веб браузере на Windows компьютере
        • Загрузите Windows инсталлятор для VintaSoft Web TWAIN сервиса (Windows версия) по ссылке: https://www.vintasoft.ru/zip/VintasoftWebTwainService-15.1.0.zip
        • Скопируйте загруженный файл VintasoftWebTwainService-15.1.0.zip в папку "wwwroot\Data\".
          Инсталятор для VintaSoft Web TWAIN сервиса (Windows версия) будет нужен, если VintaSoft Web TWAIN сервис не установлен на локальном Windows компьютере.

      • Если веб приложение будет использоваться в веб браузере на Debian/Ubuntu компьютере
        • Загрузите DEB-инсталлятор для VintaSoft Web TWAIN сервиса (Linux версия) по ссылке: https://www.vintasoft.ru/zip/VintasoftWebTwainService-15.1.0.deb
        • Скопируйте загруженный файл VintasoftWebTwainService-15.1.0.deb в папку "wwwroot\Data\".
          Инсталятор для VintaSoft Web TWAIN сервиса (Linux версия) будет нужен, если VintaSoft Web TWAIN сервис не установлен на локальном Debian/Ubuntu компьютере.

      • Если веб приложение будет использоваться в веб браузере на Fedora компьютере
        • Загрузите RPM-инсталлятор для VintaSoft Web TWAIN сервиса (Linux версия) по ссылке: https://www.vintasoft.ru/zip/VintasoftWebTwainService-15.1.0.rpm
        • Скопируйте загруженный файл VintasoftWebTwainService-15.1.0.rpm в папку "wwwroot\Data\".
          Инсталятор для VintaSoft Web TWAIN сервиса (Linux версия) будет нужен, если VintaSoft Web TWAIN сервис не установлен на локальном Fedora компьютере.
    7. Клиентская сторона: Добавьте JavaScript скрипт на страницу просмотра ASP.NET MVC.

      • Добавьте папку "Scripts" в папку "wwwroot".
      • Получите файлы Vintasoft.Shared.js, Vintasoft.Twain.js из папки "<SDK_install_path>\Bin\JavaScript\" инсталляции VintaSoft TWAIN .NET SDK или из npm-пакета 'vintasoft-web-twain-js'. Скопируйте Vintasoft JavaScript файлы в папку "wwwroot\Scripts\".
      • Откройте файл "Views\Home\Index.cshtml" и добавьте ссылки на Vintasoft JavaScript файлы на странице с кодом:
        @{
            Layout = null;
        }
        
        <!DOCTYPE html>
        
        <html>
        <head>
            <meta name="viewport" content="width=device-width" />
            <title>ASP.NET Core TWAIN Scanning Demo</title>
        
            <script src="~/Scripts/Vintasoft.Shared.js" type="text/javascript"></script>
            <script src="~/Scripts/Vintasoft.Twain.js" type="text/javascript"></script>
        </head>
        <body>
        </body>
        </html>
        
        

    8. Клиентская сторона: Создайте разметку для отсканированного изображения на странице просмотра ASP.NET MVC.

      Создайте "<input type="image">" для отсканированного изображения.
      Откройте файл "Views\Default\Index.cshtml" и добавьте HTML код в файл:
      @{
          Layout = null;
      }
      
      <!DOCTYPE html>
      
      <html>
      <head>
          <meta name="viewport" content="width=device-width" />
          <title>ASP.NET Core TWAIN Scanning Demo</title>
      
          <script src="~/Scripts/Vintasoft.Shared.js" type="text/javascript"></script>
          <script src="~/Scripts/Vintasoft.Twain.js" type="text/javascript"></script>
      </head>
      <body>
          <div style="text-align:center">
              <h3>Preview of scanned image</h3>
              <input type="image" id="previewImage" alt="Preview of scanned image" style="border:1px solid black; width:350px; height:350px" />
              <br />
              <br />
              <div id="vintasoftWebTwainServiceInstallerLinkId" hidden>
                  <a id="VSWebTwainService_WindowsInstallerUrl" href="Data/VintasoftWebTwainService-15.1.0.zip" hidden>Download Windows installer of VintaSoft Web TWAIN service</a>
                  <a id="VSWebTwainService_LinuxDebInstallerUrl" href="Data/VintasoftWebTwainService-15.1.0.deb" hidden>Download Linux installer (DEB-package) of VintaSoft Web TWAIN service</a>
                  <a id="VSWebTwainService_LinuxRpmInstallerUrl" href="Data/VintasoftWebTwainService-15.1.0.rpm" hidden>Download Linux installer (RPM-package) of VintaSoft Web TWAIN service</a>
              </div>
          </div>
      </body>
      </html>
      
      


    9. Клиентская сторона: Добавьте JavaScript код, который получает изображение от TWAIN/SANE сканера и отображает отсканированное изображение на странице.

      Откройте файл "Views\Default\Index.cshtml" и добавьте JavaScript код в файл:
      <script type="text/javascript">
          // acquire images from TWAIN/SANE scanner
          __acquireImageFromTwainScanner();
      
      
      
          /**
          * Acquires images from TWAIN/SANE scanner.
          */
          function __acquireImageFromTwainScanner() {
              // register the evaluation version of VintaSoft Web TWAIN service
              // please read how to get evaluation license in documentation: https://www.vintasoft.ru/docs/vstwain-dotnet-web/Licensing-Twain_Web-Evaluation.html
              Vintasoft.Twain.WebTwainGlobalSettingsJS.register('REG_USER', 'REG_URL', 'REG_CODE', 'EXPIRATION_DATE');
      
              // URL to the VintaSoft Web TWAIN service
              var serviceUrl = 'https://localhost:25329/api/VintasoftTwainApi';
              // a Web API controller that allows to work with TWAIN and SANE devices
              var twainService = new Vintasoft.Shared.WebServiceControllerJS(serviceUrl);
      
              // TWAIN/SANE device manager
              var deviceManager = new Vintasoft.Twain.WebTwainDeviceManagerJS(twainService);
      
              // the default settings of device manager
              var deviceManagerInitSetting = new Vintasoft.Twain.WebTwainDeviceManagerInitSettingsJS();
      
              try {
                  // open device manager
                  deviceManager.open(deviceManagerInitSetting);
              }
              catch (ex) {
                  __showVintasoftWebTwainServiceInstallerDownloadUrl();
                  document.getElementById('vintasoftWebTwainServiceInstallerLinkId').hidden = false;
                  alert(ex.message + "\n\nIf VintaSoft Web TWAIN service is installed on your computer, please close this dialog and click 'Read troubleshooting guide' link at the top of this page.\n\nIf VintaSoft Web TWAIN service is NOT installed on your computer or installed old version, please close this dialog, click 'Download installer of VintaSoft Web TWAIN service' link at the top of this page, download VintaSoft Web TWAIN service, manually install/reinstall the service on your computer, reload this web page in web browser (Firefox must be restarted) and try to scan images once again.");
                  return;
              }
      
              var device = null;
              try {
                  // get the default TWAIN/SANE device
                  device = deviceManager.get_DefaultDevice();
                  // open device without UI
                  device.open(false);
      
                  var acquireModalState;
                  do {
                      // do one step of modal image acquisition process
                      var acquireModalResult = device.acquireModalSync();
                      // get state of image acquisition
                      acquireModalState = acquireModalResult.get_AcquireModalState().valueOf();
      
                      switch (acquireModalState) {
                          case 2:   // image is acquired
                              // get acquired image
                              var acquiredImage = acquireModalResult.get_AcquiredImage();
                              // get image as Base64 string
                              var bitmapAsBase64String = acquiredImage.getAsBase64String();
                              // update image preview
                              var previewImageElement = document.getElementById('previewImage');
                              previewImageElement.src = bitmapAsBase64String;
                              break;
                          case 4:   // image scan is failed
                              alert(acquireModalResult.get_ErrorMessage());
                              break;
                          case 9:   // image scan is finished
                              break;
                      }
                  }
                  while (acquireModalState !== 0);
              }
              catch (ex) {
                  alert(ex);
              }
              finally {
                  if (device != null) {
                      // close the device
                      device.close();
                  }
                  // close the device manager
                  deviceManager.close();
              }
          }
      
          /**
           * Returns the name of user OS.
           * @returns Name of user OS.
           */
          function __getUserOS() {
              const userAgent = window.navigator.userAgent,
                  platform = window.navigator?.userAgentData?.platform || window.navigator.platform,
                  macosPlatforms = ['macOS', 'Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'],
                  windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'],
                  iosPlatforms = ['iPhone', 'iPad', 'iPod'];
              let os = null;
      
              if (macosPlatforms.indexOf(platform) !== -1) {
                  os = 'Mac OS';
              } else if (iosPlatforms.indexOf(platform) !== -1) {
                  os = 'iOS';
              } else if (windowsPlatforms.indexOf(platform) !== -1) {
                  os = 'Windows';
              } else if (/Android/.test(userAgent)) {
                  os = 'Android';
              } else if (/Linux/.test(platform)) {
                  os = 'Linux';
              }
      
              return os;
          }
      
          /**
           * Shows links, which allow to download installer of VintaSoft Web TWAIN service.
           */
          function __showVintasoftWebTwainServiceInstallerDownloadUrl() {
              var userOS = __getUserOS();
              if (userOS == 'Windows') {
                  document.getElementById("VSWebTwainService_WindowsInstallerUrl").hidden = false;
              }
              else if (userOS == 'Linux') {
                  document.getElementById("VSWebTwainService_LinuxDebInstallerUrl").hidden = false;
                  document.getElementById("VSWebTwainService_LinuxRpmInstallerUrl").hidden = false;
              }
          }
      </script>
      
      


    10. Запустите ASP.NET Core Web приложение и посмотрите результат.

      Запустите проект и посмотрите результат:


      Если VintaSoft Web TWAIN сервис не установлен на Вашем компьютере (Вы увидите сообщение об ошибке), Вам нужно выполнить следующие действия:
      • нажмите на ссылку "Загрузить инсталлятор VintaSoft Web TWAIN сервиса"
      • загрузите инсталлятор VintaSoft Web TWAIN сервиса на Ваш компьютер
      • установите VintaSoft Web TWAIN сервис на Ваш компьютер
      • обновите страницу приложения в браузере