Краткое руководство: создание первого приложения с помощью VS Code

Применяется к: Для разработчиков

Установите расширение SharePoint Embedded для Visual Studio Code, чтобы создать тип контейнера, настроить приложение-владелец и выставление счетов, зарегистрировать тип контейнера, создать контейнеры и загрузить пример приложения из управляемого представления в редакторе:

Получите расширение из Visual Studio Marketplace

Используйте расширение SharePoint Embedded Visual Studio Code, чтобы создать стандартный тип контейнера для первого приложения. Расширение также настраивает приложение-владелец, присоединяет выставление счетов Azure и регистрирует тип контейнера. Затем создается контейнер и запускается локальный пример приложения.

Эта статья начинает процесс сборки. Дополнительные инструкции по выставлению счетов см. в статье Создание и настройка типа контейнера.

Совет

Предпочитаете создавать с помощью агента программирования вместо управляемого представления? Используйте сервер SharePoint Embedded MCP для подготовки ресурсов и управления ими на естественном языке.

Предварительные условия

Прежде чем начать, убедитесь, что у вас есть:

• Установлен Visual Studio Code.
• Административный доступ к клиенту Microsoft 365.
• Клиент с доступным приложением SharePoint.
• Подписка на Azure и группа ресурсов, к которым есть доступ у вашей учетной записи.
• Разрешения владельца или участника в подписке Azure.
• Node.js и npm, установленные для примера приложения.
• Разрешение на предоставление согласия администратора в Microsoft Entra ID.

Важно!

Вам необходим административный доступ к клиенту Microsoft 365. Если у вас нет клиента, воспользуйтесь программой для разработчиков Microsoft 365, Microsoft Customer Digital Experience или пробной версией Microsoft 365 E3.

Установка расширения

Установите расширение с помощью кнопки в верхней части этой статьи или из редактора:

1. Откройте Visual Studio Code.
2. Откройте расширения на панели действий.
3. Найдите SharePoint Embedded.
4. Нажмите кнопку Установить.
5. Если расширение уже установлено, обновите его.
6. Щелкните значок SharePoint Embedded на панели действий.

Вход

1. В представлении SharePoint Embedded выберите действие входа.
2. Используйте учетную запись администратора Microsoft 365.
3. Пройдите проверку подлинности в браузере.
4. Проверьте запрашиваемые разрешения.
5. Выберите "Принять", чтобы предоставить согласие администратора.
6. Возврат в Visual Studio Code при перенаправлении.

Важно!

Внимательно просмотрите запрос на продолжение. Для настройки ресурсов разработки расширению требуются разрешения клиента.

После входа в расширение отобразится начальный вид SharePoint Embedded.

Создание стандартного типа контейнера

Тип контейнера определяет отношение, права доступа, ответственность за выставление счетов и выбранное поведение для набора контейнеров SharePoint Embedded.

1. Выберите "Создать тип контейнера".
2. В качестве метода оплаты выберите "Стандартный".
3. Введите имя типа контейнера.
4. Следуйте инструкциям, пока создание не завершится.

Используйте стандартный тип контейнера, если организация, владеющая приложением, оплачивает использование SharePoint Embedded. Для оценки выберите пробную версию. Для выставления счетов клиент-клиент выберите вариант передачи, который использует directToCustomer классификацию выставления счетов.

Создайте или выберите приложение-владелец

У каждого типа контейнеров есть одно приложение, владеющее Microsoft Entra ID.

1. Создайте новое приложение Microsoft Entra ID или выберите существующий идентификатор приложения.
2. Если вы создаете новое приложение, введите его имя.
3. Настройте параметры разработки в расширении.

Предостережение

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

Модель представлена в статье Архитектура приложения SharePoint Embedded.

Настройка стандартного выставления счетов

Для типов контейнеров Standard требуется выставление счетов в Azure. Расширение подключает выставление счетов с помощью подписки Azure и группы ресурсов, доступных для вашей учетной записи.

1. Выберите подписку Azure.
2. Выберите группу ресурсов.
3. Дождитесь, пока расширение зарегистрирует поставщика ресурсов Microsoft.Syntex и присоединит выставление счетов.

Если вы пропустили настройку выставления счетов или у вас нет необходимых разрешений Azure, в дереве отображается надпись "Выставление счетов не настроено". Чтобы завершить настройку позже, щелкните правой кнопкой мыши тип контейнера. Затем выберите "Прикрепить выставление счетов".

Локальная регистрация типа контейнера

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

1. После создания следуйте инструкциям, чтобы зарегистрировать тип контейнера в локальном клиенте.
2. Если запрос не отображается, щелкните правой кнопкой мыши тип контейнера и выберите Зарегистрировать.
3. Проверьте разрешения.
4. Предоставьте согласие администратора в браузере.
5. Вернитесь к Visual Studio Code.

Регистрация настраивает разрешения, которые приложение-владелец может использовать для контейнеров этого типа.

Создание первого контейнера

1. В дереве SharePoint Embedded разверните контейнер типа.
2. Щелкните контейнеры правой кнопкой мыши.
3. Выберите "Создать контейнер".
4. Введите имя контейнера.
5. Убедитесь, что контейнер отображается в дереве.

Контейнер — это основное хранилище и граница безопасности в SharePoint Embedded.

Загрузка примера приложения

1. В представлении SharePoint Embedded выберите "Загрузить пример приложения".
2. Выберите пример SharePoint Embedded.

1. Просмотрите предупреждение о секретах локального обычного текста.
2. Если появится запрос на создание секрета клиента, нажмите кнопку "ОК" для локальной разработки.
3. Пусть расширение заполнит файл конфигурации среды выполнения.

Важно!

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

Запуск примера приложения

Откройте терминал и запустите образец приложения из каталога сгенерированного образца.

cd [your-path]\SharePoint-Embedded-Samples\Custom Apps\boilerplate-typescript-react
npm run start

Пример начинается:

• Клиентское приложение React.
• Сервер приложений Функции Azure.

Подождите, пока не появятся оба выхода консоли.

Затем:

1. Откройте http://localhost:8080
2. Войдите в систему, используя ту же учетную запись администратора Microsoft 365.
3. Выберите "Контейнеры" на домашней странице.
4. Создавайте контейнеры и отправляйте файлы из примера пользовательского интерфейса.

Примечание.

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

Устранение неполадок при запуске

Признак	Проверка
Конфликт портов	Приложение пробует следующий доступный порт, когда используется порт 8080.
Сбой зависимостей	Запустите npm install, затем снова запустите npm run start его.
Ошибка проверки подлинности	Убедитесь, что в приложении Microsoft Entra ID есть ожидаемые URI перенаправления.
Отказано в доступе	Подтвердите регистрацию и согласие администратора.
Выставление счетов не настроено	Убедитесь, что у вас есть разрешения владельца или участника для выбранной подписки Azure, а затем используйте "Прикрепить выставление счетов".

Очистка

По окончании тестирования:

1. Удалите ненужные тестовые контейнеры.
2. Просмотрите ресурсы выставления счетов Azure, созданные для этого краткого руководства.
3. Удалите локальные образцы секретов, которые больше не нужны.

Дальнейшие действия

Дополнительные сведения о вариантах типов контейнеров см. в статье Создание и настройка типа контейнера.