2016年10月我参加了在北京举行的DevDays Asia 2016 - Office 365应用开发”48小时黑客马拉松“，我开发的一个Word Add-In Demo——WordTemplateHelper获得了二等奖。在会场有幸结识了陈希章老师，在与陈老师的交流中受益良多，得知陈老师在准备一个Office解决方案系列后，我想把这个Demo的开发过程简要介绍给大家，以支持陈老师的无私奉献，也希望更多的开发者参与到Office365的开发中来。

Office相关开发主要可以参考这个地址：https://dev.office.com/getting-started

本篇文章主要介绍其中的Office加载项开发，即Office Add-ins：https://msdn.microsoft.com/ZH-CN/library/office/jj220082.aspx

 

一、什么是Office Add-Ins

什么是Office Add-ins呢？在陈老师的上一篇文章中，对整个Office发展历史都进行了梳理，我个人的理解就是，开发者可以在Office提供的平台上，对Office做出一定的扩展以实现各种功能，比如之前录制的宏，写的VBS的脚本，某种意义上都可以看做是Office的Add-ins。当然这只是个人理解，不一定准确。目前的Office Add-Ins只支持Office2013以后的版本，开发方式也和以前的VBS有了很大的区别。

现在的Office Add-ins结构是这样的：

一个Office Add-in其实是一个Web App，可以将其部署在任意位置，它可以在一个Office应用程序中运行。有一个manifest.xml清单文件用来指定该Web App如何来呈现，包括定义Web App 的URL。当Office加载这个Add-in时，实际上是提供了一个浏览器的环境，来运行指定的Web App。也就是说，现在开发一个Office Add-in，其实跟开发网页程序差不多，这对熟悉html+java script+css的前端开发人员是非常容易上手的。微软提供了丰富的java script API来对Office进行操作，能实现什么就取决于开发者的想象力了。

一个Word Add-In的实例：

 

二、Word Template Helper需求分析

我在得知有这个活动时，并没有想好要做什么，一直到坐上赴京的高铁，才慢慢有了一个想法，这个想法也是来自平时的工作需要。在工作中经常要撰写大量的文档，如各种软件需求规格说明书、公函、文书、操作手册等，这些文档都有规定的格式，一般情况下我是将一些已经写好的Word文档保存在一个文件夹里当做模板，下次写这种文档的时候复制一份，删删减减的再改。为何不自己写个程序，将这些具有固定模式的文档作为Word模板呢？虽然Word也有自己的模板，但实际上是非常有限的，并不能完全满足我们的需要。如果这个功能做成一个模板商店，大家可以自由上传、分享各自的模板，也许会方便许多。

Word自带的模板是这样的：

这些通用模板对专业性比较强的工作来说是远远不够的。Word Template Helper的效果是这样的：

主意有了，那么就来看一下如何实现。我参加活动时的项目托管在码云上，为了写这篇文章，我重新梳理了这个小demo，在Github上建了一个项目，并尝试使用最新的.NET Core来实现后台API部分。接下来就跟我一起动手吧。

三、项目架构

首先分析一下该项目的结构。文档的模板数据，如模板标题、属性等，需要保存在数据库里，还需要一个Web API项目提供数据，Office Add-in为一个纯前端项目，使用Angular2框架，采用异步调用Web API的数据，实现搜索、加载模板等功能。插件的UI使用微软提供的Fabric UI。整个项目的技术栈如下所示：

至于文档的实体——Word文档，是以Word格式文件存储还是直接保存在数据库中呢？如果是正式项目的话，当然是保存在云存储中是最合适的，但对于一个sample来说，直接保存在数据库中也未尝不可。因为是参加开发马拉松，怎么快怎么来吧。包括ORM框架也是，只是为了快速实现采用的方式，不是最佳实践。

这个sample的开发环境配置如下：

Windows 10 x64,

VS 2017（请确保安装了Office开发工具）

VS Code

Node.js v7.10.0

NPM v4.2.0

ASP.NET Core 1.1

 

四、Web API开发

VS2017已经正式发布了，我使用最新的.NET Core来实现Web API层。

1.新建项目

新建一个空白解决方案，命名为WordTemplateHelpe，然后在其中添加一个ASP.NET Core项目：

选择Web API：

2.安装EF Core

在nuget管理器中搜索安装一下几个Nuget包：

Microsoft.EntityFrameworkCore.SqlServer：EF Core SQL Server

Microsoft.EntityFrameworkCore.Tools：EF命令行工具

Microsoft.EntityFrameworkCore.Tools.DotNet：EF Core命令行工具

3.建立Models

目前最新的EF都推荐使用Code First模式，即直接写Model，EF框架会自动创建所需的数据库。如果习惯DB First的话，也有一个很好的工具推荐：EntityFramework-Reverse-POCO-Code-First-Generator：https://visualstudiogallery.msdn.microsoft.com/ee4fcff9-0c4c-4179-afd9-7a2fb90f5838

 

可以直接在VS的扩展与更新里下载。这个工具可以很方便的根据数据库生成所需的实体类。

首先添加一个模板类型的枚举：

    /// <summary>
    /// 类型
    /// </summary>
    public enum TemplateType
    {
        /// <summary>
        /// Private
        /// </summary>
        [Description("Private")]
        Private = 0,
        /// <summary>
        /// Public
        /// </summary>
        [Description("Public")]
        Public = 1,
        /// <summary>
        /// Organization
        /// </summary>
        [Description("Organization")]
        Organization = 2,

    }

添加一个模板类：

    public class PrivateTemplateInfo
    {
        ///<summary>
        /// Id
        ///</summary>
        public string Id { get; set; }

        ///<summar