65.9K
CodeProject 正在变化。 阅读更多。
Home

使用无插件的HTML5 DocuVieware在几分钟内进行文档操作

Jeremy Likness
starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.67/5 (2投票s)

2018年6月7日

CPOL
viewsIcon

7124

随着HTML5不断发展以支持重要的业务场景，安装和管理扩展和插件的日子正迅速消逝。幸运的是，像DocuVieware这样的工具应运而生，可以在所有设备和浏览器上提供零占用、无插件的体验。

互联网正迅速成为全球企业首选的操作系统。无论您使用的是Windows、Linux还是MacOS，您很可能大部分时间都花在网页浏览器中。在网页浏览器中组织和与文档交互的需求正在增长。传统上，开发人员在构建正确的代码和集成正确的库来管理这一点方面面临挑战，并且经常需要依赖插件才能提供有意义的浏览器交互。随着HTML5不断发展以支持重要的业务场景，安装和管理扩展和插件的日子正迅速消逝。幸运的是，像DocuVieware这样的工具应运而生，可以在所有设备和浏览器上提供零占用、无插件的体验。

入门

DocuVieware是为.NET Framework 4.5编写的SDK的一部分，也可以从.NET Core 2.x引用。您可以在此处下载

http://www.docuvieware.com/download/

安装快速简便。首先，右键单击ZIP文件，选择“属性”，找到名为“安全性”的部分，然后选中“解除阻止”旁边的复选框，然后单击OK。解压缩包，然后双击MSI文件进行安装。按照提示操作，您将立即开始使用。安装将自动提示您生成一个许可证密钥，该密钥为您提供了完整的60天试用期，没有任何意外。

有几个教程可以帮助您入门

http://www.docuvieware.com/tutorials/programming/

您可以选择ASP.NET Web Forms、ASP.NET MVC Razor、ASP.NET Core，或者通过访问REST API来利用任何其他平台（在这种情况下，您将DocuVieware托管在服务器上，但从您选择的客户端访问它，无论是使用jQuery、Angular、React、Vue.js还是其他框架）。我通过遵循此处的.NET Core教程，在不到30分钟的时间内就上手了。

http://www.docuvieware.com/guides/aspnet/webframe.html#DocuVieware%20integration%20in%20.NET%20Core%20web%20application.html

安装中还包含了预制的示例，您只需打开并运行它们即可。

处理文档

示例应用程序提供了一个用于加载和与文档交互的工具栏。我首先用一个简单的文本文件进行了测试。

图1：文本文件

随后我尝试了一个富文本文件。

图2：富文本格式（RTF）

这两个文档都加载并快速准确地渲染了。接下来，我加载了我德牧的图片，并使用了旋转功能。

图3：图像旋转

在客户端，以编程方式旋转图像就像调用API一样简单。

DocuViewareAPI.RotatePage(docuViewareID, 1); // Rotate90FlipNone

那么服务器端呢？服务器上旋转的控制器方法就像这样简单。

[HttpPost("rotate")]
public string Rotate([FromBody]object jsonString)
{
    return DocuViewareControllerActionsHandler.rotate(jsonString);
}

该SDK非常直接且直观。图像查看器控件支持超过100种栅格、矢量和元数据格式，从PNG和TIFF到DOCX和PDF。

注解

协作的一个重要功能是添加注释的能力。DocuVieware支持对任何类型的文档进行注释。您可以将带注释的文档保存为PDF或TIFF格式与他人共享。下面是一个用于本文的Word文档的示例，我上传并对其进行了几项注释，包括高亮、尺子、圈出文本、添加便签和自由绘图。

图4：注释

可以以编程方式添加注释。这是添加一个绿色文本注释的代码，内容为“Paid by cash”。

function addTimeStamp() {
    timeStampAppearance = {
        fill: false,
        stroke: false,
        fontStyle: 0,
        foreColor: "#1CA30D",
        opacity: 1,
        text: "Paid by cash",
        alignment: 0,
        lineAlignment: 0
    };
    DocuViewareAPI.AddTextAnnotInteractive("DocuVieware1", timeStampAppearance, true, ["fontName", "fontStyle", "foreColor", "fontSize", "text", "opacity"]);
}

您可以完全控制各种属性，包括笔触的粗细以及注释的透明度。保存带注释的文档就像调用Save方法并传递成功或失败的处理程序一样简单。该工具会自动提示用户使用对话框选择要保存的文件名和格式。

表单交互

便携式文档格式，简称PDF，是一种被广泛采用的文档共享规范，与设备或操作系统无关。它是一种特别有用的格式，因为它支持表单，使用户能够填写信息，甚至签署文档。以下是用于税务信息的W9表单的示例。DocuVieware准确地渲染PDF，并使表单字段可供填写（例如姓名和业务）和勾选（例如税务分类）。

图5：带表单字段的PDF文档

DocuVieware API还支持以编程方式访问和操作表单字段。这可以实现诸如使用PDF文档将信息发布到服务器，或根据登录用户预填充表单数据等场景。API调用GetPageFormFields返回页面上表单项的数组。以下示例演示了如何访问W9表单字段以及第一个字段的属性外观。

请注意，您可以完全控制外观、字体、属性和值。以下代码片段以编程方式检索表单字段，并将表单上的名称更新为“JavaScript Jane”。

var docuControl = document.getElementById('DocuVieware1').control;
var fields = docuControl.GetPageFormFields(1);
fields[0].properties.value = 'JavaScript Jane';
docuControl.UpdateFormFields(fields);

与其他格式一样，更新后您可以以编程方式提示用户保存文档。

搜索

在文档中查找文本的能力是DocuVieware内置的另一项重要功能。以下代码在当前页面上执行对单词“check”的不区分大小写的搜索。

var docuControl = document.getElementById('DocuVieware1').control;
docuControl.Search('check', true, false, 0, true);

搜索结果如下所示。

图6：搜索结果

调用搜索功能会导致以下操作。

  1. 搜索对话框将自动打开，并已选择和填充搜索参数。
  2. 将显示搜索结果的文本。
  3. 文档本身将在搜索结果匹配的地方高亮显示。

当然，用户可以使用内置的搜索对话框进行自己的搜索。

结论

客户需要丰富的文档处理能力，并希望将其集成到他们的业务应用程序中。Web是运行应用程序的主要操作系统，用户希望他们的应用程序在他们拥有的每台设备上都能“按原样”工作，从计算机到平板电脑再到智能手机。DocuVieware通过快速、清晰的渲染和直观易用的API，在任何现代浏览器上提供这些功能。该API提供了超过2000个在客户端和/或服务器上运行的函数。UI完全可定制，并提供移动友好体验。

立即下载您的60天试用版，开始使用！

http://www.docuvieware.com/download/

© . All rights reserved.