使用 LEADTOOLS 进行 HTML5 Web 扫描

引言

扫描和文档捕获是大多数文档成像应用程序的重要方面和起点。对于Web开发人员来说，这是一个令人头疼的要求，因为扫描仪和图像捕获设备具有本地化、依赖硬件的特性。开发人员会遇到许多障碍，而客户往往会面临繁琐且耗时的不便，这使得应用程序难以使用。例如，在单独的应用程序中扫描会为客户创建一个繁琐的工作流程。浏览器插件通过将应用程序锁定在特定浏览器中来限制应用程序的灵活性。最后但同样重要的是，更新和维护多个代码库可能会让您的基于Web的扫描应用程序变成一场噩梦。

LEADTOOLS开发了一个Web扫描SDK，该SDK解决了许多这些障碍，并提供了一个对程序员友好且可定制的框架，用于将TWAIN（Windows）和Sane（Linux）扫描集成到单一的基于Web的文档成像解决方案中。在本白皮书中，我们将探讨这个创新框架的Windows版本的内部工作原理，并重点介绍开发人员如何仅用几行代码即可对其进行扩展和定制，以适应他们的应用程序。

LEADTOOLS Web扫描组件和架构

LEADTOOLS Web扫描由两个主要组件组成：一个使用HTML5和JavaScript构建的跨浏览器Web界面，以及一个自托管Web服务。这些组件中的每一个都考虑了最大的可扩展性，并且能够通过简单的更新程序和多开发人员团队的关注点分离来创建健壮的Web应用程序。

此架构的灵活性允许开发人员为新项目使用一个或多个组件，或者为他们现有的Web企业解决方案添加Web扫描功能。

HTML5/JavaScript Web应用程序

客户端通过一个健壮的Web界面驱动应用程序，该界面使用LEADTOOLS HTML5图像查看控件，并通过RESTful JavaScript命令与SHWS通信。LEADTOOLS附带的演示包括缩略图浏览器、图像查看器以及几个客户端工具，包括平移、缩放、适应、拉伸和放大镜。还可以轻松添加其他功能，包括注释和标记、拖放等。最重要的是，由于此应用程序是使用HTML5和JavaScript设计的，因此它可以在运行SHWS的Windows或Linux计算机上的任何支持的浏览器上运行，而无需任何浏览器插件。

自托管Web服务

LEADTOOLS Web扫描应用程序的核心是ScanningService，一个自托管Web服务（SHWS）。这是一个必需的组件，因为TWAIN设备的驱动程序只能安装在客户端计算机上。SHWS通过JavaScript接收REST命令，允许浏览器客户端选择TWAIN源，协商TWAIN功能，获取状态，并将图像获取到本地缓存，Web应用程序可以通过URI加载该缓存。

_scanningService.acquire(true, function (status) {
   for (; this._totalScannedPages < status.pageCount; this._lastPageNumber++) {
      this.addThumbnail(this._lastPageNumber + 1);
   }
}

除了与扫描仪协商外，SHWS的另一个主要功能是对图像应用图像处理。其可扩展的接口建立在CommandCallback之上，可用于实现LEADTOOLS的200多个图像处理功能中的任何一个。在客户端，调用ApplyImageProcessingCommand JavaScript函数将触发SHWS的Run函数，该函数将应用图像处理函数和参数到图像，并将图像返回给客户端。

public static void Run(PageImageProcessingEventArgs e)
{
   string commandName = e.CommandName;
   string arguments = e.Arguments;
   RasterImage image = e.Image;

   if (e.IsPreview)
      DemoUtils.ResizeImage(image, e.PreviewWidth, e.PreviewHeight);

   // check the commands
   var ipFunction = _ipCommands[commandName] != null ? _ipCommands[commandName] : null;
   if (ipFunction != null)
      ipFunction(image, arguments);
} 
// Dictionary mapping list of IP commands to their respective functions
private static readonly IDictionary<string, IPFunction> _ipCommands = new Dictionary<string, IPFunction>
{
   { "Flip", FlipImage },
   { "Rotate", RotateImage },
   { "Deskew", DeskewImage },
   { "HolePunchRemove", HolePunchRemove },
   { "BorderRemove", BorderRemove }
};
//...
private static void DeskewImage(RasterImage image, string arguments)
{
   int angleRange = DemoUtils.JsonStringToInteger(arguments, "angleRange");
   int angleResolution = DemoUtils.JsonStringToInteger(arguments, "angleResolution");
   RasterColor fillColor = DemoUtils.JsonStringToRasterColor(arguments, "fillColor");
   int flags = DemoUtils.JsonStringToInteger(arguments, "flags");

   DeskewCommand cmd = new DeskewCommand(fillColor, (DeskewCommandFlags)flags);
   cmd.AngleRange = angleRange;
   cmd.AngleResolution = angleResolution;

   cmd.Run(image);
}

通过Command Callback进行进一步定制

CommandCallback的用途不仅仅是图像处理。实际上，该回调的设计是为了实现完全的控制和定制。任何您想编写到SHWS中的内容都是可能的：将图像保存到本地文件夹、将图像上传到云存储、OCR、条形码等。下面的简单示例演示了如何将扫描的图像保存到本地驱动器。

JavaScript代码

private saveImageBtn_Click(e: JQueryEventObject): void {
   var param: any = new Object();
   param.filename = GetFileName(); // Get from dialog
   param.format = GetFileFormat(); // Get from dialog
   $.get(this._scanningService.runCommand("SaveToLocal", param, null));
}

扫描服务代码

private Stream CommandCallBack(CommandEventArgs args)
{
   if (args.CommandName == "SaveToLocal")
   {
      try
      {
         // Use constructor of custom class to convert JSON from event args
         SaveToLocalParams saveParams = new SaveToLocalParams(args);
         SaveToLocal(saveParams);
      }
      catch (Exception ex)
      {
         MessageBox.Show(ex.ToString());
      }
   }
   // Handle additional user commands
   return null;
}

private void SaveToLocal(SaveToLocalParams saveParams)
{
   RasterImage page = null;
   RasterCodecs codecs = new RasterCodecs();
   // Check to see how many pages have been scanned
   TwainStatus status = this.ScanningService.GetStatus(saveParams.Id, saveParams.UserData);
   for (int pageNumber = 1; pageNumber <= status.PagesCount; pageNumber++)
   {
      // Save the page by appending it to the end of the file
      page = this.ScanningService.GetImage(saveParams.Id, pageNumber);
      if (page != null)
      {
         codecs.Save(page, saveParams.FileName, saveParams.Format, 
            0, 1, 1, -1, CodecsSavePageMode.Append);
      }
   }
}

结论

在跨浏览器HTML5解决方案中将文档扫描为数字图像格式，只是LEADTOOLS可以解决的众多实际解决方案之一。其最先进的Web扫描SDK使得创建创新的新Web应用程序以捕获文档成为可能，并提供了一个对程序员友好且模块化的架构，用于将Web扫描添加到任何现有的Web应用程序或工作流中。它还为使用LEADTOOLS Imaging SDKs中的许多附加技术来扩展您的基于Web的文档成像解决方案打开了大门。LEADTOOLS通过其全面的栅格、文档、医疗和多媒体成像工具包系列，提供了巨大的价值。

下载完整的HTML5 Web扫描示例

您可以下载包含上述功能的完整功能演示。要运行此示例，您需要以下条件：

• LEADTOOLS 免费 60 天试用版
• Visual Studio 2008 或更高版本
• 浏览至 LEADTOOLS 示例文件夹（例如，C:\LEADTOOLS 19\Examples\），您可以在其中找到此示例以及 LEADTOOLS 中许多其他技术的示例项目。

支持

需要帮助来启动和运行这个示例吗？联系我们的支持团队以获得免费技术支持！有关定价或许可问题，您可以联系我们的销售团队（sales@leadtools.com）或致电704-332-5532。