SharePoint 2016: конструируем надстройку с помощью Visual Studio

В опубликованной в этом же номере статье «Приступаем к проектированию локальных надстроек» основное внимание уделяется базовым принципам. Освоив их, можно приступить к изучению методов использования Visual Studio и конструирования надстроек.

Чтобы создать надстройку, нужно задействовать Visual Studio 2013 или 2015 и проверить доступность элементов SharePoint (см. экран 1).

Экран 1. Решения SharePoint доступны

В Visual Studio предусмотрен раздел как для надстроек Office, так и для SharePoint. Шаблоны проекта SharePoint Solutions предназначены для создания программного кода, требующего полного доверия, а Office Add-ins служит исключительно для создания надстроек Microsoft Add-ins. В разделе Apps отображаются два простых проекта: один для Office и один для SharePoint (см. экран 2).

Экран 2. Проекты для Office и для SharePoint

Для нашего решения мы выбрали App for SharePoint. После того как вы выбираете проект, запускается мастер, позволяющий назначать определенные свойства, а именно тип надстройки и URL-адрес сайта SharePoint. При проектировании лучше всего использовать сайт SharePoint на основе шаблона Development Site (см. экран 3).

Экран 3. Шаблон Development Site

После того как сайт создан, мы завершаем работу мастера с использованием URL-адреса нашего Development Site. Еще нам нужно выбрать тип надстройки — SharePoint Hosted («Размещено в SharePoint») или Provider Hosted («Размещено у поставщика»). Мы выбрали размещение в SharePoint, так как для этого не требуется дополнительной настройки в локальной среде SharePoint. Если выбрать Provider Hosted, то для работы надстройки потребовалось бы настроить дополнительные компоненты (см. экран 4).

Экран 4. Размещение сайта в SharePoint

Затем нужно указать версию SharePoint, используемую для надстройки. Этот шаг позволяет добавить к коду решения нужные ссылки на файлы. Для этой надстройки выбираем SharePoint 2013 (см. экран 5).

Экран 5. Выбор версии SharePoint

Затем мастер подготавливает основные файлы проекта и решение (см. экран 6).

Экран 6. Подготовка основных файлов проекта и решения

После того как все решение загружено, оно отображается в структуре, показанной на экране 7.

Экран 7. Структура решения

В каждом контейнере можно хранить объекты, начиная со страниц JavaScript и кончая любыми другими необходимыми ресурсами. Поскольку надстройка размещается в SharePoint, в ней не используется управляемый код C# — только код, исполняемый на клиенте, такой как JavaScript или jQuery. SharePoint можно подключить для использования с объектной моделью JavaScript или прямыми вызовами API REST.

Щелкнув правой кнопкой мыши на проекте, мы смогли добавить другие компоненты (см. экран 8).

Экран 8. Добавление компонентов

Эти компоненты могут быть добавлены с применением собственной процедуры установки в стиле мастера и файлов определения XML вместо объявления старыми методами. Мастера обеспечивают добавление элементов в файлы Elements.xml для конкретных контейнеров в решении.

Очень важно ознакомиться с базовым кодом. В файле App.js приводится код, который должен быть вызван, когда загружается надстройка или выполняется доступ к default.aspx (см. экран 9).

Экран 9. Базовый код

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

var user = context.get_web
   ().get_currentUser ();

Этот код вызывается со страницы default.aspx основной надстройки. В процессе вывода он просто отображается в местозаполнитель страницы и в тег HTML DIV с идентификатором сообщения (см. экран 10).

Экран 10. Вызов кода

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

Прежде всего нужно назначить разрешения. Для этого дважды щелкните файл AppManifest.xml. Будет запущена специальная панель, из которой можно задавать различные параметры.

На главной вкладке можно указать имя, версию, значок, начальную страницу и строки запроса, а также тип надстройки SharePoint (см. экран 11).

Экран 11. Указание параметров решения

На второй вкладке пользователи могут установить тип и разрешения (см. экран 12). Следует иметь в виду, что не все разрешения строго необходимы.

Экран 12. Установка типа и разрешения

После того как разрешения заданы, можно изменить компонент, используемый для активации, и построить решение. Последний шаг — опубликовать надстройку. В результате будут сформированы элементы, показанные на экране 13.

Экран 13. Публикация надстройки

После нажатия кнопки Package the app будет сформирован файл. app в папке выходных данных Visual Studio:

{Путь кода}\Sample\bin\Debug\
   app.publish\1.0.0.0

Подготовив файл app, можно выполнить развертывание нажатием кнопки F5 или просто передать файл на сайт разработки в SharePoint. Для этого откройте библиотеку App Packages и передайте файл app (см. экран 14).

Экран 14. Передача файла

На данном этапе доступна ссылка New App to Display на домашней странице. С ее помощью вы получите список переданных и готовых к использованию надстроек.

Попросите администратора, ответственного за установку надстройки, подтвердить разрешения (см. экран 15).

Экран 15. Подтверждение настройки

Затем происходит развертывание надстройки; ссылка отображается слева.

Надстройка размещается в доме­не по отдельному URL-адресу. При запуске надстройки загружается страница default.aspx и отображается сообщение инициализации, которое затем меняется на имя пользователя, полученное из кода контекста (см. экран 16).

Экран 16. Запуск надстройки

Как мы видим, из готового проекта формируется необходимый базовый набор компонентов, и процесс развертывания очень прост.