Приложениями Microsoft Office 365 сегодня пользуются более миллиарда человек по всему миру. Это крупнейшая платформа, которая доступна на разнообразных устройствах от больших настольных ПК до миниатюрных смартфонов. С выходом новых версий Office 365 все эти пользователи становятся и вашими польователями, так как новые возможности платформы позволяют интегрировать решения разработчиков прямо в рабочий процесс всех офисных приложений! Благодаря кроссплатформнености офиса, и его API основанном на HTML5 ваши приложения смогут работать на всех платформах, включая планшеты iOS, Andoird и Windows. Я рад приветствовать первый пост от Александры Богдановой в специальной колонке разработки под Office 365. — Владимир Юнев, technical evangelist, Microsoft Russia

Ну что же, у нас уже есть замечательные колонки про веб и ASP.NET, я решила поддержать это движение и начать новый цикл статей про Office 365. Новые офисные API, создание приложений, различные альтернативные сценарии применения офиса — все это в колонке «Office как Платформа».



Помимо целого набора различных офисных приложений и сервисов, Office 365 предоставляет интересные возможности для разработчиков. Здесь кратко описаны основные нововведения и возможности Office 365. Сегодня мы подробнее познакомимся с инструментами разработки под Office 365 и рассмотрим несколько примеров приложений для Excel и Word.

Что же Office 365 может предложить для разработчиков?

Во-первых, у Office 365 есть API, позволяющее интегрировать офис в приложения и тем самым расширять их функционал работы с файлами. API Office 365 предоставляет большое число возможностей для работы с почтой, обменом файлами, календарями и контактами. Также приятно, что API доступно не только для Windows/Windows Phone, а также для Android и iOS.

Во-вторых, у вас есть возможность расширить стандартные возможности офисных программ путем написания различных «надстроек». Например, вы можете добавить возможность проигрывания видеофайлов непосредственно в Outlook, встроить карты Bing в свой отчет или каким-то образом обработать введенные файлы.

Ну что же, давайте начнем погружаться в мир офисных приложений именно со знакомства с «надстройками» для приложений.

Как работают офисные приложения?

Простейшее приложение для офиса состоит из статической веб-страницы и манифеста приложения в формате XML. HTML страница может быть размещена на любом веб-сервере или в службе, например, в Microsoft Azure. Файл манифеста должен указывать на расположение веб-страницы, его нужно опубликовать в общедоступном Магазин Office, внутреннем списке SharePoint или на общем сетевом ресурсе. Также манифест определяет параметры и возможности приложения, такие как URL-адрес веб-страницы, на которой реализованы пользовательский интерфейс и программная логика, имя, описание, идентификатор, версия и языковой стандарт приложения, уровень разрешений и требования к доступу к данным для этого приложения.



Какие возможности мы можем использовать при создании офисных приложений?

• Предоставлять интерактивный пользовательский интерфейс и пользовательскую логику посредством JavaScript.
• Использовать платформы JavaScript, такие как jQuery.
• Подключаться к конечным точкам REST и веб-службам через HTTP и AJAX.
• Запускать код или логику на стороне сервера, если страница создана с использованием языка сценариев на стороне сервера, такого как ASP или PHP.

Общая структура офисных приложений понятна. Теперь посмотрим, как мы можем разделить приложения в зависимости от их функционала.

Типы офисных приложений

Офисные приложения можно разделить на три типа:

Примечание. Все эти приложения могут быть запущены как на настольных версиях Office, так и на мобильных в планшетах Windows, iOS, Android! Кроме того, расширение для Outlook так же сможет работать в онлайн-версиях Oultook.com и Outlook из Office 365 в браузере пользователя!

Приложения области задач

Приложения области задач работают параллельно с документом Office и позволяют предоставлять контекстные сведения и функциональные возможности для повышения удобства просмотра и создания документов. Например, приложение области задач может искать и получать сведения о продукте из веб-службы на основе названия продукта или кода позиции, выбранного в документе.



Контентные приложения

Контентные приложения позволяют создавать привлекательные визуализации данных в Интернете, использовать встроенные возможности работы с мультимедиа (такие как видеопроигрыватель YouTube или галерея изображений), а также задействовать другой внешний контент.



Почтовые приложения

Почтовые приложения могут работать с сообщениями электронной почты (просмотр, создание, удаление писем), календарями (создавать и удалять события и встречи). Почтовые приложения могут анализировать данные из письма и работать с ними, например, «вычленять» адрес из письма и автоматически наносить его на карту Bing.

Что нужно для создания офисных приложений

Вы можете создавать приложения как при помощи Visual Studio, так и при помощи средства разработки приложений Napa. Средства разработки Napa для Office 365 — это веб-среда, позволяющая создавать проекты, писать код и запускать приложения в браузере. Дополнительно ничего устанавливать не нужно – вся работа над приложением выполняется в окне браузера.

Если вам привычнее создавать приложения в Visual Studio, то для этого вы можете использовать специальный шаблон, содержащий все файлы, необходимые для создания и тестирования приложений.

Безусловно, есть еще один способ – создавать приложения в текстовом редакторе. В случае, если вы выбрали этот способ, то вам необходимо создать 4 файла:

• HTML-файл, который реализует пользовательский интерфейс приложения.
• XML-файл манифеста, который определяет метаданные, необходимые для отображения и запуска приложения в Word или Excel.
• CSS-файл, определяющий таблицу стилей в приложении.
• Файл project.js, содержащий логику программирования JavaScript, которая может использовать интерфейс JavaScript API для Office (Office.js).

Мы же не будем останавливаться на создании приложений в текстовом редакторе, а познакомимся со средством разработки Napa, а затем создадим приложение в Visual Studio.

Создаем офисное приложение в средстве разработки Napa

Для создания приложения в среде разработки Napa вам необходимо:

• Учетная запись Office 365 (подписка для разработчиков);
• Приложение Средства разработки Napa для Office 365.

Если вы раньше не сталкивались с Office 365 и с разработкой под него, то начните с создания сайта разработчика. О том, как это сделать вы можете прочитать в подробной инструкции здесь.

Первое, что вам необходимо сделать – зайти на сайт разработчика и нажать на иконку «создать приложение»



Выберите тип приложения, которое вы хотите создать – почтовое, контентное, приложение области задач или приложение для SharePoint. Для примера, создадим контентное приложение.



После создания приложения, откроется страница, на которой в левой части экрана будут отображаться файлы приложения, в центре – код приложения.



Здесь вы можете дописывать необходимый код, компилировать приложение, менять его свойства и загружать в магазин офисных приложений. По умолчанию, при запуске приложения (для запуска нажмите на кнопку «play» в левой части панели) откроется дополнительная вкладка с Excel Online, с возможностью протестировать созданное приложение. Поменять приложение, для которого вы пишете надстройку можно в Свойствах(Properties) -> Запуск(Run) на левой панели.

Начнем модифицировать стандартный пример. Будем создавать приложение, которое будет загружать картинки из сервиса Flickr. Добавим на Html-страницу раздел Images (под разделом Content) и изменим название кнопки get-data-from-selection на "Поиск по Flickr". Полный код тела Html страницы вы можете увидеть под спойлером.


Добавьте в JS файл вашего проекта функцию, которая будет показывать изображения, связанные с выделенным текстом.


Не забудьте инициализировать ее в функции getDataFromSelection()

Все, приложение готово. Запустите его в Microsoft Word и наслаждайтесь красивыми фотографиями. Я вот потренировалась на кошках)



Итак, я надеюсь, вы получили представление о том, что из себя представляет Napa и как использовать ее при создании офисных приложений. Мне же привычнее создавать код в Visual Studio, далее посмотрим создание приложений при помощи нее.

Создаем офисное приложение в Visual Studio

Что вам необходимо при создании офисных приложений в Visual Studio:

• Visual Studio (начиная с 2012) версии
• Офисные инструменты для Visual Studio (для 2013 версии можно скачать здесь)

Создайте новый проект. Из списка доступных проектов выберите Visual C# или Visual Basic, затем, Office/SharePoint -> Приложения -> Приложение для Office. Также, как и при создании приложений при помощи Napa, вам необходимо выбрать тот тип приложения, который вы будете создавать. Напомню, вы выбираете из почтового, контентного и приложения области задач. Затем, укажите в каких приложениях должно работать ваше: Word, Excel, Power Point.



Посмотрим, как создать приложение, которое будет добавлять данные в ячейку книги Excel.

Для начала, откроем файл Home.html, который располагается по пути App -> Home -> Home.html

Добавьте в начало файла ссылку на библиотеку jQuery:

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

Внутри тега <body> добавляем <div> элемент, пишем надпись: «Наше первое офисное приложение». Также не забываем добавлять кнопку, по нажатию на которую, надпись будет добавляться в ячейку.

<div> Наше первое офисное приложение</div>
<button id="writeDataBtn"> Записать данные в ячейку </button><br />

В файл Home.js добавьте функцию, отвечающую за добавление надписи в ячейку, а также обработчик вызова этой функции.

Функция добавления надписи в ячейку будет выглядеть так:

function writeData() {
        Office.context.document.setSelectedDataAsync("Учимся создавать офисные приложения", function (asyncResult) {
            if (asyncResult.status === "failed") {
                writeToPage('Error: ' + asyncResult.error.message);
            }
        });
}

При запуске приложения в правой части листа откроется панель с созданным приложением. Если вы все сделали верно, то, при нажатии на кнопку, как и ожидается, в выделенную ячейку добавится текст.



Простейшее приложение готово. Перейдем к вопросу распространения созданных офисных приложений.

Публикация приложений

Когда мы создаем мобильное приложение, то вопрос, как его распространять, обычно не возникает, т.к., как правило, мы выбираем надежный и проверенный путь распространения приложений — через соответствующие магазины приложений. Для офисных приложений все не так очевидно. В общем случае существует 4 способа, как можно распространить офисное приложение:

Магазин Office. Он представляет собой удобное место для загрузки разработчиками новых решений приложений, предназначенных как для потребителей, так и для компаний. По сути, он является аналогом привычного для нас магазина приложений.

Каталог приложений для Office в SharePoint. Вы можете настроить каталоги приложений непосредственно для своей компании, настроив свой мини магазин офисных приложений.

Каталог Exchange. Является частным каталогом для почтовых приложений, доступных пользователям сервера Exchange, на котором они и хранятся. С его помощью можно публиковать и управлять корпоративными почтовыми приложениями, включая собственные приложения и приложения в Магазин Office, лицензированными для корпоративного использования.

Каталог приложений общей сетевой папки. ИТ-отделы и разработчики могут также разворачивать приложения в общей сетевой папке, где хранятся файлы манифестов. Пользователи могут получать приложения, указывая эту общую папку в качестве доверенного каталога, или, в случае, если эта пака как доверенный каталог.

Вы можете опубликовать любым способом как приложение, созданное в Napa, так и приложение, созданное в Visual Studio.

Процесс публикации приложения состоит из трех шагов, которые немного различаются в зависимости от того, каким образом вы создаете приложение. Для приложений, созданных при помощи Napa, вам необходимо сначала упаковать приложение, затем разместить его файлы на веб-сервер, а, затем, загрузить XML-файл манифеста приложения в Магазин Office.

Для приложений из Visual Studio, порядок следующий: настроить страницу публикации приложения, затем, упаковать и опубликовать приложение (загрузить XML-файл манифеста приложения в Магазин Office). Подробнее о процедурах публикации вы можете прочитать здесь.

Заключение

Мы познакомились с основами создания офисных приложений и рассмотрели простейшие примеры – создали приложение для Word в специальной среде Napa и поработали с ячейками книги Excel на основе шаблона для создания офисных приложений в Visual Studio. Создавайте различные «надстройки», упрощайте работу с данными, интегрируйте поисковые системы – подстраивайте Office 365 под потребности вас и вашей компании. Используйте платформу Office 365 для доступа к миллиарду новых пользователей для вашего решения!

Дополнительные ссылки для тех, кто заинтересовался

Посмотреть основную документацию по созданию офисных приложений вы можете на портале Центра Разработки Office, также вы можете скачать примеры готовых приложений.

Кроме того вам могут быть полезны следующие материалы: расширение Office 365 руководство для архитекторов, новые материалы Office 365 Patterns & Practices, разработка нативных приложений iOS с Office 365 SDK и работа с Office 365 API для разработки приложений.

Об авторе

Александра Богданова, project manager отдела Customer and Partner Experience, Microsoft Russia. Участник различных конференций, митапов, хакатонов, в том числе Microsoft Developer Tour и Microsoft Developer Conference.