Почніть з плагіна Power Pages для GitHub Copilot CLI та Claude Code

Плагін Power Pages для GitHub Copilot CLI та Claude Code забезпечує робочий процес із підтримкою штучного інтелекту для створення, розгортання та управління сучасними сайтами односторінкових додатків (SPA) на Power Pages. Замість ручного створення проєктів, написання шаблонного коду API та налаштування дозволів, опишіть, що вам потрібно, природною мовою, і плагін керує реалізацією.

Плагін підтримує повний життєвий цикл розробки сайту через розмовні навички — від створення нового сайту до його розгортання, налаштування моделей даних Dataverse та налаштування автентифікації.

Important

  • Генеративний AI-кодувальний агент, такий як GitHub Copilot CLI або Claude Code, використовує навички та робочі процеси цього плагіна для виконання завдань, специфічних для Power Pages.
  • Код і конфігурація, згенеровані агентом кодування ШІ, можуть бути неточними. Перевіряйте, тестуйте та перевіряйте весь згенерований контент перед його затвердженням або розгортанням. Завжди переглядайте пропозиції агентів перед їх затвердженням .

вимоги

Перед початком переконайтеся, що у вас є потрібне програмне забезпечення та дозволи.

Вимоги до програмного забезпечення

Компонент Мінімальна версія Додаткові відомості
Node.js 18.0 або пізніше Завантажити Node.js
Power Platform CLI (PAC CLI) Версія 2.6.3 або новіша версія (обов'язково для логіки сервера) Встановити PAC CLI
Azure CLI Останні новини Встановити Azure CLI
GitHub Copilot CLI або Claude Code Останні новини GitHub Copilot CLI або код Клода
Visual Studio Code та розширення Power Platform Tools (необов'язково) Останні новини Завантажити VS код і встановити інструменти Power Platform

Вам також потрібно:

  • Середовище Power Platform з увімкненим Power Pages.
  • Автентифікована сесія PAC CLI, підключена до вашого цільового середовища. Біжи pac auth create , якщо ще не підключився.
  • Сесія Azure CLI, увійшла до того ж орендаря. Запустіть az login --allow-no-subscriptions для автентифікації.

Перевірте автентифікацію:

Перевірте, що ви автентифіковані, використавши команду pac auth list .

pac auth list           # Should show authenticated profile

Якщо ви не автентифіковані, виконайте цю команду:

pac auth create --environment <Instance url>        # Authenticate to Power Platform

Порада

Щоб отримати URL екземпляра, перейдіть до Power Pages home, виберіть іконку Settings у верхньому правому куті, а потім виберіть Session details.

Встановіть плагін

Встановіть плагін Power Pages з маркетплейсу. Якщо ви використовуєте GitHub Copilot CLI, дивіться документацію Copilot CLI розширення для еквівалентних етапів встановлення. Наступні команди використовують синтаксис Claude Code.

Запустіть інсталятор, щоб налаштувати всі плагіни з увімкненим автооновленням:

Windows (PowerShell):

iwr https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js -OutFile install.js; node install.js; del install.js

macOS/Linux/Windows (cmd):

curl -fsSL https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js | node

Інсталятор автоматично з'являється:

  • Встановлює pac CLI, якщо він ще не встановлений.
  • Виявляє доступні інструменти, такі як Claude Code і GitHub Copilot CLI.
  • Реєструє маркетплейс плагінів і встановлює всі вказані плагіни.
  • Вмикає автооновлення, щоб плагіни залишалися актуальними.

Після встановлення перезапустіть Claude Code або GitHub Copilot CLI, щоб отримати доступ до навичок плагіна у вигляді слеш-команд у вашій сесії агента.

Встановлення з маркетплейсу

  1. Відкрий код Клода у своєму терміналі.

  2. Додайте Microsoft Marketplace:

    /plugin marketplace add microsoft/power-platform-skills

  3. Встановіть плагін Power Pages:

    /plugin install power-pages@power-platform-skills

Після встановлення плагіна перезапустіть Claude Code або GitHub Copilot CLI, щоб отримати доступ до навичок плагіна у вигляді slash-команд у вашій сесії агента.

Порада

Щоб автоматично отримувати оновлення на ринку та навички, увімкніть автоматичне оновлення. Використайте /plugin команду, перейдіть у Marketplace, виберіть маркетплейс і увімкніть автооновлення.

Огляд навичок

Плагін надає навички, які охоплюють повний життєвий цикл сайту Power Pages. Виконуйте кожну навку розмовно, або як slash команду, або описуючи, що ви хочете to do.

Уміння Команда Що він робить
Створити сайт /create-site Підкріплює сайт, застосовує напрямок дизайну та створює сторінки та компоненти
Місце розгортання /deploy-site Створює проєкт і завантажує його на Power Pages за допомогою PAC CLI
Активувати сайт /activate-site Забезпечує запис на вебсайті та призначає публічну URL-адресу
Налаштуйте модель даних /setup-datamodel Створює таблиці, стовпці та зв'язки Dataverse
Додати зразкові дані (за бажанням) /add-sample-data Заповнює таблиці Dataverse реалістичними тестовими записами
Інтеграція веб-API /integrate-webapi Генерує типізований клієнтський код, сервіси та дозволи таблиці
Додати підсумки ШІ /add-ai-webapi Інтегрує генеративні AI API для узагальнення (резюме пошуку та узагальнення даних) у ваші сторінки. Генерує сервіс типізованого резюме з обробкою токенів проти підробки, специфічними для фреймворку обгортками, сайтами з дротовими дзвінками та відповідними Summarization налаштуваннями сайту
Налаштування автентифікації /setup-auth Додає систему входу, виходу та керування доступом за ролями. Підтримує Microsoft Entra ID, Зовнішній ID Microsoft Entra, OpenID Connect, SAML 2.0, WS-Federation, обліковий запис Microsoft, Facebook, Google, а також локальну автентифікацію за ім'ям користувача та паролями, включаючи конфігурації з кількома провайдерами
Створення веб-ролей /create-webroles Генерує YAML-файли веб-ролі для управління access користувачем
Додати логіку сервера /add-server-logic Генерує захищені серверні JavaScript-кінцеві точки для валідації, зовнішніх викликів API, управління секретами та операцій з даними
Додайте хмарний потік /add-cloud-flow Інтегрує існуючі хмарні потоки Power Automate на ваш сайт для робочих процесів затвердження, сповіщень і запланованої автоматизації
Інтегрований бекенд /integrate-backend Аналізує ваш прототип, визначає правильний підхід (веб-API, серверна логіка або хмарний потік) для кожної функції та оркеструє повну послідовність збірки
Додайте SEO /add-seo Генерує robots.txt, sitemap.xmlта мета-теги
Провести перевірку безпеки /security-review Координує сфокусовані навички безпеки та об'єднує всі висновки в одному HTML-звіті. Охоплює код, залежності, сканування розгорнутих сайтів, заголовки браузера, міжмережевий екран веб-додатків, права доступу таблиць та налаштування автентифікації
Сканування вихідного коду /scan-code Виконує статичний аналіз і сканування залежностей локальних вихідних файлів; Висвітлює результати у вигляді шаблонів коду, вразливих пакетів, жорстко закодованих секретів та проблем з ліцензіями
Сканування розгорнутого сайту /scan-site Запускає серверне сканування безпеки на живому сайті, отримує останній звіт і групує результати за ступенем тяжкості
Керування заголовками безпеки браузера /manage-headers Перевіряє та налаштовує HTTP-заголовки безпеки, які сайт надсилає браузерам — Політика безпеки контенту, захист кадрів і клікджекингу, спільний обмін між джерелами, поведінка cookie та пов'язані налаштування сайту
Керування міжмережевим екраном веб-додатків /manage-firewall Перевіряє та налаштовує міжмережевий екран веб-додатків (WAF) на виробничому сайті: вмикає захист, додає або видаляє IP-блоки, блокування країн, блокування шляхів та обмеження швидкості
Дозволи для таблиці аудиту /audit-permissions Перевіряє доступи існуючих таблиць за кодом сайту та метаданими Dataverse; створює HTML-звіт, згрупований за тяжкістю з запропонованими виправленнями
План розгортання /plan-alm Визначає стан проєкту, збирає вашу стратегію підвищення, створює візуальний план і координує інші навички управління життєвим циклом додатку (ALM) у правильному порядку
Авторське рішення /setup-solution Створює видавця та рішення, додає компоненти Power Pages, класифікує налаштування сайту та пропонує змінні середовища та секрети Azure Key Vault
Налаштуйте конвеєрний хост /ensure-pipelines-host Забезпечує або виявляє хост-середовище для конвеєрів енергетичної платформи
Налаштуйте конвеєр /setup-pipeline Реєструє визначення конвеєра в Dataverse і прив'язує етапи просування до цільових середовищ
Розгортання через конвеєр /deploy-pipeline Запускає розгортання конвеєра для цільового етапу з перевизначення змінних середовища на кожен етап
Середовище силового зв'язку /force-link-environment Перепризначає цільове середовище новому хосту Power Platform Pipelines, коли конфлікт хоста блокує розгортання
Експорт рішень /export-solution Експортує рішення у вигляді керованого або некерованого zip-файлу з перевіркою повноти перед експортом
Імпорт рішення /import-solution Імпортує ZIP рішення у цільовому середовищі, поетапне чи пряме
Полігон для випробувань /test-site Перевірка розгорнутого сайту за допомогою браузерного тестування: сканування сторінок, перевірки доступу за ролями та перевірки Web API
Діагностичне розгортання /diagnose-deployment Порівнює невдачі розгортання з каталогом відомих помилок і пропонує виправлення

Типовий робочий процес

Поширений наскрізний робочий процес слідує такій послідовності:

  1. /create-site : Риштування, дизайн і створення сторінок
  2. /deploy-site : Завантажте у ваше Power Pages середовище
  3. /activate-site : Налаштувати публічну URL
  4. /setup-datamodel : Створити таблиці Dataverse
  5. /add-sample-data : Заповніть таблиці тестовими записами
  6. /integrate-webapi : Генерація клієнтського коду API та налаштування дозволів
  7. /create-webroles : Визначте access ролі
  8. /setup-auth : Додайте вхід, вихід і інтерфейс на основі ролі
  9. /add-server-logic : Додайте безпечні серверні кінцеві точки
  10. /add-cloud-flow : Інтегрувати існуючі потоки Power Automate
  11. /add-seo : Оптимізація для пошукових систем
  12. /deploy-site : Запустити фінальні зміни в реальному режимі
  13. /security-review : Проведіть наскрізний огляд безпеки перед переходом у продакшн
  14. /plan-alm : Просувайте свій сайт у тестових і виробничих середовищах

Порада

  • Тобі не потрібно дотримуватися цього точного порядку. Кожна навичка перевіряє свої передумови і повідомляє, чи чогось бракує. Наприклад, ви можете запустити /setup-auth раніше /integrate-webapi , якщо вашому сайту потрібна автентифікація спочатку.
  • Якщо ви не впевнені, який підхід використовувати для кожної функції, виконуйте /integrate-backend кроки з 4 по 10 окремо. Він аналізує ваш прототип, визначає, чи кожна функція потребує Web API, Server Logic або хмарний потік, і координує навички у правильному порядку.
  • Щоб додати пошук, згенеровані ШІ, та записи резюме, запустіть /add-ai-webapi після /integrate-webapi. Він повторно використовує права доступу таблиці та налаштування сайту, які /integrate-webapi налаштовуються, тому запускайте його, коли ваша веб-API інтеграція.

Створіть свій сайт Power Pages

Цей огляд охоплює повний життєвий цикл створення сайту Power Pages за допомогою плагіна — від структури до розгортання. Кожен крок описує те, що ви кажете, і що плагін робить у відповідь.

Крок 1: Створіть свій сайт

Опишіть сайт, який ви хочете, природною мовою: для чого він, які сторінки потрібні, а також будь-які дизайнерські вподобання, такі як кольорова гама, стиль верстки чи шрифти. Запустіть /create-site або просто опишіть свій сайт, і плагін розпізнає намір.

Якщо ви не вказуєте фреймворк, плагін просить обрати один (React, Vue, Angular або Astro), тоді:

  1. Scaffold project з шаблону застосовує назву сайту, кольори та дизайн-токени.
  2. Встановлює залежності, запускає сервер розробки та відкриває живий попередній перегляд браузера.
  3. Він створює кожну сторінку, компонент і маршрут, які ви запитали, з релевантними зображеннями.
  4. Створює git-коміти на важливих етапах, щоб мати вбудовану історію відкатів.

Крок 2: Розгорніть свій сайт

Запустіть /deploy-site, щоб завантажити свій сайт на Power Pages. Плагін:

  1. Перевіряє, що PAC CLI встановлено і ваша сесія автентифікації активна.
  2. Підтверджуйте цільове середовище перед тим, як рухатися далі.
  3. Запускає продакшн-білд і завантажує скомпільований результат.
  4. Створює каталог розгортання artifacts, якщо він ще не існує.

Нотатка

Якщо ваше середовище блокує певні вкладення файлів, плагін виявляє проблему і надає інструкції для її вирішення.

Крок 3: Активуйте свій сайт

Біжіть /activate-site , щоб зробити сайт публічно доступним. Плагін:

  1. Пропонує піддомен на основі назви вашого сайту і дозволяє налаштувати його.
  2. Надає запис на вебсайті через API Power Platform.
  3. Опитування, доки сайт не стане активним і не поверне публічну URL.

На цьому етапі у вас є робочий сайт за публічною URL. Наступні кроки включають додавання даних, автентифікації та SEO. Пропускайте всі кроки, які не стосуються вашого сайту.

Крок 4: Налаштуйте свою модель даних

Запусти /setup-datamodel , щоб створити таблиці Dataverse, які потрібні вашому сайту. Якщо у вас вже є діаграма ER або конкретна схема, надайте її безпосередньо замість того, щоб агент аналізував ваш код.

Плагін створює агент Data Model Architect, який:

  1. Аналізує код вашого сайту, щоб визначити, які дані потрібні сторінкам і компонентам.
  2. Запитує у вашому середовищі Dataverse існуючі таблиці, щоб уникнути дублікатів.
  3. Пропонує модель даних із таблицями, стовпцями, типами даних і зв'язками, візуалізованою у вигляді діаграми ER.

Ви переглядаєте і затверджуєте пропозицію. Плагін нічого не створює, поки ви не підтвердите. Після затвердження плагін створює таблиці та стовпці через виклики API та зберігає файл маніфесту, який використовують Steps 5 і 6.

Крок 5: Додайте зразкові дані (необов'язково)

Завантажуйте /add-sample-data свої таблиці тестовими записами. Цей крок вимагає моделі даних із Кроку 4.

Плагін виконує такі дії:

  1. Читає маніфест, щоб зрозуміти ваші таблиці, стовпці та зв'язки.
  2. Генерує контекстуально відповідні значення для кожного типу стовпця, такі як реалістичні листи, правдоподібні дати та відформатовані суми валюти.
  3. Вставляє записи у порядку залежностей (батьківські таблиці перед дочірніми) і автоматично оновлює токени автентифікації під час масових вставок.

Крок 6: Інтеграція з веб-API Dataverse

Запустіть /integrate-webapi заміну макет даних на живі запити Dataverse. Цей крок вимагає моделі даних із Кроку 4.

Плагін виконує такі дії:

  1. Сканує вашу кодову базу на наявність компонентів, які використовують імітаційні дані, заповнювальні виклики або жорстко закодовані масиви. Він відображає ці компоненти з вашими таблицями Dataverse.
  2. Створює агент інтеграції веб-API для кожної таблиці, який генерує:
    • Спільний API-клієнт з управлінням токенами проти підробки та логікою повторного спробування.
    • Типи сутностей TypeScript та мапери доменів.
    • CRUD-сервісний шар.
    • Шаблони, специфічні для фреймворку, такі як React-хуки, композабельні Vue або сервіси Angular.
  3. Створює агент архітектора дозволів , який пропонує дозволи таблиць і налаштування сайту.

Ви переглядаєте та затверджуєте пропозицію щодо дозволів. Плагін не створює жодних конфігураційних файлів, поки ви не підтвердите.

Додати підсумки, створені штучним інтелектом (необов'язково)

Запускайте /add-ai-webapi багатошарові генеративні AI-резюме поверх вашої інтеграції з веб-API. Навичка підключає два API для передперегляду резюме до сторінок деталей запису та списку:

  • API підсумку пошуку: Повертає стиснутий за допомогою ШІ резюме результатів пошуку з посиланнями.
  • API узагальнення даних: Повертає узагальнення для кожного запису або інсайти на рівні списку для таблиці Dataverse.

Цей крок базується на моделі даних із Step 4 та інтеграції Web API з Step 6. Плагін виконує такі дії:

  1. Сканує ваш код на предмет підсумкових інтеграційних точок і підтверджує цільові сторінки, таблиці та які API варто використовувати.
  2. Делегує всі відсутні передумови Web API — дозволи таблиці, списки стовпців і веб-ролі — на /integrate-webapi і /create-webroles, тому існує єдине джерело правди для дозволів.
  3. Створює агент інтеграції веб-API AI , який генерує типізований сервіс резюме (aiSummaryService.ts) з обробкою токенів проти підробки, фреймворковими обгортками (React-хуки, Vue composables або Angular-сервіси) та дротовими сайтами дзвінків на цільових сторінках.
  4. Створює AI-агент Web API Settings Architect, який створює Summarization налаштування сайту для запитів і обмежень на контент.

Ви переглядаєте та затверджуєте пропозиції. Плагін не генерує код і не створює налаштування, поки ви не підтвердите.

Нотатка

API узагальнення перебувають у попередньому перегляді і залежать від увімкнення адміністративних та контролів на рівні сайту. Якщо після розгортання резюме не з'являться, переконайтеся, що функція увімкнена через відповідні налаштування сайту та адміністративні елементи. Для отримання додаткової інформації див. Data summarizeization API огляд та Power Pages пошук з генеративним AI.

Крок 7: Створіть веб-ролі

Запустіть /create-webroles для визначення ролей користувачів access. Плагін:

  1. Запитує у вашому середовищі існуючі веб-ролі, щоб уникнути дублювання.
  2. Генерує визначення ролей з унікальними ідентифікаторами.
  3. Вимагає, щоб кожен сайт мав максимум одну анонімну роль і одну автентифіковану роль.

Крок 8: Налаштуйте автентифікацію

Запрацюйте /setup-auth , щоб додати систему входу, виходу та керування доступом за ролями на вашому сайті. Плагін підтримує такі провайдери ідентифікації, і ви можете налаштувати одного або кілька провайдерів одночасно.

Provider Найкраще підходить для
Зовнішній ID Microsoft Entra (рекомендовано для сайтів, орієнтованих на клієнтів) Публічні сайти та клієнтські портали з реєстрацією на самообслуговування.
Microsoft Entra ID Внутрішні портали для працівників або партнерські сайти для бізнесу до бізнесу (B2B). Power Pages автоматично налаштовує основного орендаря сайту, тому вам не потрібно вводити інформацію про орендаря.
Microsoft, Facebook, Google Соціальний вхід для споживчих аудиторій.
Локальна автентифікація Ім'я користувача та пароль, увійти в систему. Не рекомендується і налаштовується лише тоді, коли ви явно запитуєте.

Для отримання додаткової інформації про підтримуваних провайдерів, включаючи протоколи та особливості конфігурації, див. Огляд автентифікації в Power Pages.

Плагін:

  1. Аналізує ваш сайт (мету, сторінки, аудиторію) і пропонує розумний стандартний варіант. Наприклад, плагін пропонує Зовнішній ID Microsoft Entra з відкритою реєстрацією для сайту, орієнтованого на клієнта, або Microsoft Entra ID з реєстрацією лише за запрошеннями для внутрішнього порталу. Ви приймаєте рекомендацію або обираєте власних послуг.
  2. Для кожного провайдера він проведе вас через усі необхідні кроки в адміністративному центрі ідентифікатора, такі як створення орендарів, реєстрація додатків, створення користувацьких потоків, а також захоплення ідентифікаторів клієнтів і URI перенаправлення. Плагін перевіряє кожне значення, яке ви вставляєте назад у розмову, і обчислює точний URI перенаправлення для вашого сайту, щоб значення, вставлене в реєстрацію додатку, відповідало значенню, записаному в налаштуваннях сайту.
  3. Запитує, як дані профілю користувача мають надходити від провайдера ідентифікації до контактного запису Dataverse (картування претензій), чи слід синхронізуватися лише при кожному вході або при першому вході, а також чи слід автоматично пов'язувати зовнішні входи з існуючими контактами електронною поштою.
  4. Генерує сервіс автентифікації, оголошення типів, ролеві утиліти авторизації (hasRole, RequireAuth, RequireRole), hook session keepalive, який запобігає безшумному завершенню терміну дії сесій SPA, а також компонент інтерфейсу входу/виходу, інтегрований із вашим макетом сайту. Плагін використовує патерни вашого фреймворку по всьому процесу, такі як React-хуки, композабельні пристрої Vue, сервіси Angular або компоненти Astro.
  5. Коли налаштовано більше одного провайдера, створюється /login сторінка у вибраному вами макеті: горизонтальний рядок, вертикальний стек, основний прожектор або вкладка.
  6. Записує налаштування відповідного сайту для .powerpages-site/site-settings/ кожного постачальника, режим реєстрації, картографування претензій та опціональна функція.

Плагін також налаштовує такі додаткові функції при їх увімкненні:

  • Умови та положення: Сторінка SPA користувачі /terms повинні прийняти перед входом, а також налаштування відповідного сайту та фрагменти контенту.
  • сторінка профілю користувача: Сторінка SPA /user-profile, де користувачі, що увійшли в систему, редагують свої контактні дані через Power Pages Web API.
  • Федеративний вихід: Також виходить користувач у провайдера ідентифікації при виході з сайту, для спільних пристроїв або регульованих ситуацій.

Порада

Щоб додати другого провайдера ідентичності до існуючого сайту, запустіть /setup-auth знову. Плагін виявляє, що вже налаштовано, і пропонує додати нового провайдера без перезапису існуючих. Цей підхід корисний для інкрементальних ситуацій, наприклад, починаючи з Зовнішній ID Microsoft Entra і пізніше додаючи Google для соціального входу.

Нотатка

Авторизація на стороні клієнта (RequireAuth, RequireRole, hasRole) призначена лише для користувацького досвіду. Він контролює те, що бачить користувач. Серверні дозволи таблиць, налаштовані для /integrate-webapi забезпечення фактичної безпеки.

Крок 9: Додайте логіку сервера

Запустіть /add-server-logic , щоб додати безпечні серверні ендпоінти на ваш сайт. Використовуйте Server Logic , коли вашому сайту потрібна логіка, яка не може працювати в браузері, наприклад, зовнішні API-виклики, серверна перевірка, управління секретами або операції з даними між суб'єктами.

Important

Підтримка логіки сервера вимагає версії PAC CLI 2.6.3 або новішої версії. Використовуйте скрипт швидкої установки , щоб оновити до останньої версії.

Опишіть, що вам потрібно, простою мовою, і плагін:

  1. Створює агент Server Logic Architect , який аналізує ваш кейс і класифікує його складність.
  2. Пропонує дизайн кінцевих пристроїв, конфігурацію безпеки та необхідні дозволи таблиці для вашого перегляду.
  3. Після затвердження генерує серверну JavaScript-кінцеву точку за /_api/serverlogics/<name>адресою .
  4. Створює типізований клієнтський сервіс для виклику кінцевої точки з ваших компонентів.
  5. Оновлює компоненти, щоб викликати нову службу.
  6. Налаштовує призначення веб-ролей і дозволи таблиць для кінцевої точки.

Ви переглядаєте і затверджуєте пропозицію. Код не генерується, поки ви не підтвердите.

Поширені сценарії використання:

Нотатка

Запускайте /add-server-logic один раз на кожен випадок. Наприклад, якщо вашому сайту потрібна і кінцева точка перевірки інвентарю, і глобальна пошукова точка, запустіть цю навичку двічі.

Крок 10: Інтеграція хмарних потоків

Запустіть /add-cloud-flow, щоб інтегрувати існуючі Power Automate хмарні потоки у ваш сайт. Ця навичка підключає ваш сайт Power Pages до потоків, які ви вже створили в Power Automate. Це не створює нових потоків у хмарах.

Плагін:

  1. Реєструє існуючий хмарний потік на вашому сайті.
  2. Генерує код на стороні клієнта, щоб запускати потік з ваших сторінок.
  3. Обробляє асинхронні стани робочих процесів і шаблони зворотного виклику.
  4. Це підключає обмін даними між сторінкою та потоком.

Використовуйте /add-cloud-flow для робочих процесів затвердження, електронних сповіщень, запланованих завдань і автоматизації на основі подій, які краще справляються Power Automate, ніж серверними кінцевими точками.

Альтернатива: використовуйте /integrate-backend для планування повного сервісного рівня

Якщо ви не впевнені, які функції потребують Web API, Server Logic або хмарного потоку, запустіть /integrate-backend замість ручного виконання кроків з 4 по 10. Ця навичка виконує роль оркестратора, що:

  1. Аналізує ваш прототип, щоб визначити всі функції, які потребують сервісного рівня.
  2. Класифікує кожну функцію за правильним підходом: Web API для стандартного CRUD, Server Logic для серверної валідації та зовнішніх API, або Cloud Flow для робочих процесів затвердження та автоматизації.
  3. Пропонує послідовний план виконання з усіма навичками, залежностями та конфігураціями.
  4. Після схвалення організуйте навички у правильному порядку.

План є стійким, відновлюваним і редагованим. Зупиняйтеся після будь-якого кроку, щоб переглянути згенерований код або протестувати сайт, і продовжуйте з того місця, де зупинилися, запускаючи /integrate-backend знову.

Крок 11: Додайте SEO

Біжіть /add-seo , щоб оптимізувати свій сайт для пошукових систем. Плагін:

  1. Виявляє маршрути з конфігурації маршрутизатора вашого фреймворку.
  2. Генерує директиви пошукових систем і карту сайту для всіх виявлених маршрутів.
  3. Додає мета-теги: viewport, charset, description, Open Graph, Twitter Card та посилання на фавікон.

Крок 12: Розгорніть останній сайт

Якщо ви виконуєте якісь додаткові кроки, запустіть /deploy-site знову, щоб активувати зміни. Плагін запускає продакшн-білд і завантажує сайт разом із усіма артефактами розгортання (права доступу таблиць, налаштування сайту, веб-ролі, логічні файли сервера) у ваше середовище Power Pages.

Крок 13: Проведіть перевірку безпеки

Провіться /security-review повний огляд безпеки вашого сайту перед переходом до виробництва. Ця навичка організовує сфокусовані навички безпеки та об'єднує всі висновки в одному HTML-звіті за адресою docs/security-review-<timestamp>.html.

Плагін ставить одне просте питання про вашу мету і обирає відповідний набір фокусованих навичок:

Goal Що перевіряє
Код і конфігурація Вихідний код, залежності, права доступу таблиці та конфігурація автентифікації. Працює лише з локальними файлами — розгортання не потрібне.
Рекомендована готовність до випуску ) Повний огляд перед публікацією. Виконує всі спеціалізовані навички: код і залежності, сканування розгорнутих сайтів, заголовки безпеки браузера, фаєрвол веб-додатків, права доступу таблиць та автентифікація.
Розгорнутий об'єкт Лише сканування на розгорнутій об'єкті в реальному режимі. Корисно для постійного моніторингу опублікованого сайту.

Після підтвердження плагін запускає паралельно навички, орієнтовані на відповідність, і записує їхні висновки в один звіт:

  • /scan-code: Виконує статичний аналіз (opengrep) та сканування залежностей (trivy) локальних вихідних файлів. Surface кодує шаблони, вразливі пакети, жорстко закодовані секрети та проблеми з ліцензіями. Якщо будь-який інструмент не встановлений, навичка пропонує ручний перегляд коду як запасний варіант.
  • /scan-site: Запускає серверне сканування безпеки на живому сайті та отримує останній звіт. Тривалість сканування залежить від розміру об'єкта — маленькі ділянки закінчуються за кілька хвилин, великі — годинами. Результати групуються за тяжкістю. Потрібен розгорнутий сайт.
  • /manage-headers: Перевіряє заголовки безпеки HTTP, налаштовані за .powerpages-site/site-settings/: Політика безпеки контенту, X-Frame-Options, CORS, файли cookie SameSite та пов'язані налаштування. Виявляє відсутні або слабкі значення та пропонує рекомендовані варіанти за замовчуванням.
  • /manage-firewall: Перевіряє фаєрвол веб-додатків (WAF) для виробничого сайту, включаючи стан керованих правил і користувацькі правила (IP-блоки, блоки країн, блоки шляхів, обмеження швидкості). Доступний лише на виробничих майданчиках у підтримуваних регіонах; Навичка виявляє та повідомляє про проблеми з відповідністю.
  • /audit-permissions: Перевіряє існуючі дозволи на таблиці за кодом сайту та метаданими Dataverse. Виявляють відсутні дозволи, надмірно дозволені ролі, невикористані дозволи та проблеми зі схемою YAML.

Консолідований звіт групує результати за розділами, відкривається у вашому браузері за замовчуванням і містить рекомендації з усунення у простій мові. З чату плагін пропонує пройтися по виправленнях — оберіть знаходження, і плагін активує навичку з фокусом на відповідність інтерактивно для застосування змін.

Нотатка

Перевірка безпеки ніколи не застосовує зміни автоматично. Кожна сфокусована навичка виконується у режимі лише для читання під час консолідованого проходження. Щоб застосувати виправлення, плагін активує навичку відповідності інтерактивно після вибору дії.

Порада

Ви також можете використовувати будь-яку сфокусовану навичку окремо:

  • Запускайте /scan-code під час розробки, щоб рано виявити проблеми на рівні коду.
  • Запустіть /manage-headers для виправлення конкретної помилки політики безпеки контенту або налаштування CORS.
  • Запусти /manage-firewall , щоб додати обмеження тарифу на сторінці входу або заблокувати трафік за країнами.
  • Запустіть /audit-permissions після зміни прав доступу таблиці, щоб переконатися, що вони все ще збігаються з кодом сайту.
  • Повторний запуск /security-review із метою Deployed site — моніторинг виробничого майданчика протягом часу.

Перевірте свій сайт

Після завершення навичок переконайтеся, що ваш сайт Power Pages працює коректно.

  1. Перейдіть на Power Pages.
  2. Знайдіть свій сайт у списку активних об'єктів .
  3. Попередній перегляд вашого сайту на десктопі, скориставшись опцією «Попередній перегляд ».
  4. Перевірте функціональність.

Просувайте свій сайт у різних середовищах

Після того, як ваш сайт працюватиме у вашому середовищі розробки, використовуйте навички управління життєвим циклом додатків (ALM) для просування його у тестових і продакшн-середовищах. Плагін упаковує ваш сайт як рішення Power Platform, визначає значення, що відрізняються залежно від середовища, і розгортає рішення через Power Platform Pipelines або вручну експорт і імпорт.

Щоб використовувати навички ALM, потрібно хоча б одне цільове середовище Power Platform (тест, продакшн або обидва). Щоб скористатися опціональним потоком Azure Key Vault для секретів, вам також потрібен дозвіл на створення сховища ключів у вашій підписці Azure.

Планування розгортання

Біжи /plan-alm , щоб почати. /plan-alm це початкова точка для ALM і оркеструє інші навички ALM, тому зазвичай їх не проводять безпосередньо. Плагін:

  1. Виявляє поточний стан вашого проєкту, рішення та цільових середовищ.
  2. Запитує про вашу стратегію просування (Power Platform Pipelines або ручний експорт і імпорт), цільові етапи та будь-які обмеження для застосування.
  3. Він створює візуальний план docs/alm-plan.html , який показує кожну дію, яку має намір зробити.
  4. Чекає твого схвалення перед тим, як запускати будь-який наступний навик.

План зберігається на диску, тому кожна наступна навичка читає і записує з одного й того ж збереженого плану. Якщо фаза не вдається, запускайте /plan-alm знову, і вона відновлюється.

Автор розв'язання

Запустіть /setup-solution свій сайт як рішення Power Platform. Плагін:

  1. Створює видавця та рішення, а потім додає компоненти Power Pages: сайт, веб-ролі, серверні логічні кінцеві точки, реєстрації хмарних потоків і налаштування провайдера OAuth.
  2. Класифікує кожне налаштування сайту за чутливістю та пропонує змінні середовища для значень, що відрізняються залежно від середовища.
  3. Пропонує забезпечити Azure Key Vault та зберігати в ньому значення типу облікових даних, такі як рядки з'єднань і ключі API.
  4. Працює в режимі синхронізації, коли рішення вже існує для вашого сайту, щоб узгодити компоненти без створення нового рішення.

Ви переглядаєте і затверджуєте пропозицію. Плагін не створює жодної конфігурації, поки ви не підтвердите.

Порада

Якщо ваше рішення занадто велике або заплутане, щоб надійно розгорнути, плагін рекомендує розділення і пропонує, де його розділити. Підтвердіть розподіл перед застосуванням змін.

Розгортання за допомогою конвеєрів Power Platform

Якщо ви обрали Power Platform Pipelines як стратегію просування, плагін запускає такі навички:

  1. /ensure-pipelines-host забезпечує або виявляє хост-середовище для конвеєрів енергетичної платформи. Навичка обирає найдешевший варіант для вашого орендаря: безкоштовний хостинг платформи, додаток Pipelines у існуючому середовищі або власний хостинг.
  2. /setup-pipeline реєструє визначення конвеєра в Dataverse, налаштовує вибрані вами етапи та прив'язує кожен етап до цільового середовища.
  3. /deploy-pipeline запускає розгортання для етапу, застосовує змінні середовища для кожного етапу, через deploymentSettings.jsonякий переобіймає , і відстежує стан у реєстрі розгортання.

Якщо розгортання не вдається, оскільки цільове середовище вже пов'язане з іншим хостом Power Platform Pipelines, плагін може запустити /force-link-environment його для перепризначення. Ця дія вимагає вашої явної згоди і може бути зворотною.

Розгортання з ручним експортом і імпортом

Якщо вибрати ручний шлях, плагін запускається:

  1. /export-solution експортувати рішення як керований або некерований ZIP з перевіркою повноти перед експортом.
  2. /import-solution імпортувати ZIP у цільовому середовищі, або поетапно перевіряючи залежності, або прямо.

Активуйте та перевірте розгорнутий сайт

Після успішного розгортання в цільовому середовищі плагін:

  1. Запускається /activate-site для створення публічної URL у цільовому середовищі.
  2. Запускає /test-site перевірку розгортання. Плагін використовує браузер для сканування представницьких сторінок, виконання перевірок доступу на основі ролей, перевірки /_api/ викликів і захоплення форм відповіді з /_api/serverlogics/ кінцевих пристроїв. Навичка показує результат як PASS, WARNINGSабо FAIL, з деталями для перевірки, пов'язаними з планом.

Якщо крок не вдається, плагін запускається /diagnose-deployment. Навичка зіставляє невдачу з каталогом відомих помилок розгортання, таких як застарілий манифест, відсутні залежності, конфлікти хостів, заблокований JavaScript або прострочена автентифікація, і пропонує конкретне виправлення. Плагін ніколи не застосовує виправлення без вашої згоди.

Нотатка

Кожна навичка ALM читає та записує артефакти на диску: маніфест рішення, дані плану, реєстр конвеєра, реєстр розгортання та результати тестів. Оркестровка відновлюється і підлягає ауду. Щоб побачити, що сталося на кожному кроці, огляньте артефакти.

Поради та найкращі практики

Наступні поради допоможуть вам максимально ефективно використовувати плагін і AI-кодувальний агент при створенні сайтів Power Pages.

Слідкуйте за виходом з терміналу на наявність відсутніх інструментів при першому запуску

Плагін надає навички та робочі процеси, але агент кодування ШІ — GitHub Copilot CLI або Claude Code — виконує самі команди на вашому комп'ютері. Коли ви вперше користуєтеся цими інструментами, уважно слідкуйте за виходом з клеми. AI-агент кодування виконує команди та скрипти за лаштунками, і деякі з цих команд залежать від інструментів, які можуть не бути встановлені на вашому комп'ютері. Якщо крок не вдається, вивід термінала зазвичай показує, який інструмент або команду не вдалося знайти.

Якщо ви бачите помилку на кшталт command not found або is not recognized, встановіть відсутній інструмент і повторно запускайте робочий процес. Агент кодування ШІ продовжує з того місця, де зупинився, після того як інструмент стає доступним.

Переглядайте пропозиції агентів перед затвердженням

Агент програмування ШІ подає пропозиції, наприклад, від Data Model Architect та Permissions Architect, перед внесенням змін. Код і конфігурація, згенеровані AI-кодувальним агентом, можуть бути неточними, тому переглядайте, тестуйте та перевіряйте кожну пропозицію та весь згенерований код перед її затвердженням або розгортанням.

  • Пропозиції моделей даних: Перевірте, чи відповідають назви таблиць, типи стовпців і зв'язки вимогам вашого бізнесу. Легше скоригувати пропозицію, ніж перейменовувати стовпці після того, як дані вже вставлені.
  • Permissions Proposals: Перевірте, чи кожна роль має правильний рівень access (створити, прочитати, оновити, видалити) для кожної таблиці. Надмірно дозволені дозволи на таблиці є поширеною загрозою безпеці.
  • Згенерований код: Прочитайте згенерований код і протестуйте сайт локально перед розгортанням. Код, створений ШІ, може містити помилки або проблеми з безпекою.

Вставляти помилки безпосередньо з контекстом

Коли щось виходить з ладу — чи то помилка збірки, помилка розгортання чи виняток під час виконання в браузері — скопіюйте повний результат помилки. Вставте його разом із коротким описом того, що ви робили. Чим більше контексту ви надасте, тим швидше виправлення.

Приклад: помилка збірки

I ran npm run build and got this error. Fix it.

error TS2339: Property 'jobTitle' does not exist on type 'JobPosting'.

  src/components/JobCard.tsx:24:31
    24   <Text>{posting.jobTitle}</Text>

Порада

Вкажіть ім'я файлу, команду, яку ви виконали, і те, що очікували від стану. Плагін використовує цей контекст, щоб знайти проблему та застосувати цілеспрямоване рішення, а не здогадуватися.

Поділитися помилками Web API з повним URL запиту

Поширеною проблемою після розгортання є помилка 403 від Power Pages Web API, коли стовпець не увімкнений для доступу до API. Коли ви стикаєтеся з цією помилкою, вставте повний URL API та повну відповідь на помилку JSON. Повідомлення про помилку точно повідомляє, яку таблицю та стовпець потрібно виправити, і плагін може оновити YAML дозволу таблиці та налаштування сайту.

Приклад: стовпець не увімкнений для Web API (403)

I'm getting a 403 error when the documents page loads. Here's the API call and the response. Fix the issue so this API works.

URL:
https://my-site.powerappsportals.com/_api/crd50_documents?$select=crd50_documentid,crd50_name,crd50_documentcategory,crd50_filetype,crd50_filesize,crd50_updateddate,crd50_description,_crd50_propertyid_value

Response:
{
  "error": {
    "code": "90040101",
    "message": "Attribute _crd50_propertyid_value in table crd50_document is not enabled for Web Api.",
    "innererror": {
      "code": "90040101",
      "message": "Attribute _crd50_propertyid_value in table crd50_document is not enabled for Web Api.",
      "type": "AttributePermissionIsMissing"
    }
  }
}

Ця помилка (AttributePermissionIsMissing) означає, що стовпець _crd50_propertyid_value пошуку існує в таблиці Dataverse, але не вказаний у конфігурації дозволу таблиці для веб-API. Плагін усуває цю помилку, додаючи відсутній стовпець до дозволу таблиці YAML .powerpages-site/table-permissions/ in і перерозгортаючи його.

Нотатка

Power Pages Web API вимагає, щоб кожен стовпець, повернений викликом API, був явно вказаний у дозволі таблиці. Властивості пошуку (з _ префіксом і суфіксом ) _valueлегко пропустити, оскільки їхня назва API відрізняється від логічної назви стовпця в Dataverse. Коли ви бачите AttributePermissionIsMissing, завжди додавайте цей стовпець до дозволу таблиці. Не змінюйте запит API.

Будь конкретним щодо того, чого хочеш

Розмиті запити дають нечіткі результати. Вкажіть плагіну точно, що вам потрібно, включно з налаштуваннями макета, полями даних і поведінкою.

Замість Ознайомлення
"Створіть сторінку для пошуку вакансій" "Створіть сторінку вакансій із пошуковим рядком угорі, фільтрувальними чіпами за місцем і відділом, а також картковою сіткою з посадою, компанією, діапазоном зарплати та датою оголошення для кожної роботи"
"Виправте укладку" "Картки вакансій складаються вертикально на робочому столі. Зробіть їх у вигляді тристовпної сітки з зазором 16px на екранах ширше за 768px"
"Додай трохи даних" "Додайте 20 прикладних вакансій у чотирьох відділах (інженерія, маркетинг, продажі, HR) з реалістичними назвами, зарплата в діапазоні від $60k-$180k та датами оголошень за останні 30 днів"
"Налаштувати API" "Підключіть компонент JobListings до таблиці cr_jobposting Dataverse. Замініть жорстко закодований масив на реальний виклик API, який забирає назву, відділ, зарплату та дату публікації»
"Додати вхід" "Налаштуйте вход Microsoft Entra Entra External ID з відкритою реєстрацією, а також Google як другим провайдером. Покажіть їх горизонтальним рядком на сторінці входу.»

Використовуйте скріншоти для візуальних проблем

Якщо сайт виглядає неправильно в браузері, зробіть скріншот і вставте його безпосередньо в розмову або вкажіть шлях до файлу. Візуальний контекст допомагає виявити проблеми з розташуванням, інтервалами та стилізацією, які важко описати в тексті.

The header overlaps the hero section on mobile. Here's a screenshot:

[paste screenshot or provide path to screenshot file]

Fix the header so it doesn't overlap. It should be a fixed header with the content starting below it.

Ітерація поступово крокує

Замість того, щоб описувати весь сайт одним запитом, створюйте поступово. Почніть зі структури та планування, потім додавайте функції по черзі. Такий підхід дає вам можливість повторити та скоригувати курс на кожному етапі.

Step 1: /create-site → Get the basic scaffold and layout right
Step 2: "Add a hero section to the home page with a search bar"
Step 3: "Add a job listings page with filter and sort"
Step 4: "Add a job detail page that shows full description"
Step 5: /setup-datamodel → Create tables now that you know the data shape
Step 6: /integrate-webapi → Wire up real data

Порада

Після кожного кроку перевіряйте попередній перегляд браузера. Якщо щось не так, виправте це перед тим, як рухатися далі. Легше вирішити проблеми в одному компоненті, ніж розплутувати їх по всьому сайту.

Попросіть пояснення перед тим, як схвалити

Якщо ви сумніваєтеся у запропонованій зміні, особливо щодо дозволів, модифікацій моделей даних або конфігурації автентифікації, попросіть плагін пояснити, що він планує to do і чому, перш ніж затверджувати.

Before you create the table permissions, explain what access each role will have and why. I want to understand the security implications.

Виконуйте навички самостійно, щоб відновитися після проблем

Якщо навичка провалюється посередині, починати все спочатку не потрібно. Кожна навичка працює незалежно і може продовжити з того місця, де зупинилася. Наприклад, якщо /integrate-webapi третя таблиця не спрацювала, можна перезапустити її, і вона виявить вже виконану роботу.

/integrate-webapi failed while processing the cr_applications table. Here's the error: [paste error]. Resume the integration from where it stopped.

Пов’язаний вміст

  • Last updated on