Zeptejte se pomocí Adaptivní karty

Adaptivní karty umožňuje přidávat fragmenty obsahu do agentů Copilot Studio, které se dají otevřít i s jinými cloudovými aplikacemi a službami. Chcete-li svému agentovi poskytnout bohaté možnosti konverzace, můžete zahrnout text, grafiku a tlačítka. Vzhledem k tomu, že jsou nezávislé na platformě, můžete snadno přizpůsobit Adaptivní karty vašim potřebám.

S uzlem Adaptivní karta může váš agent zobrazit adaptivní kartu obsahující jedno nebo více tlačítek pro odeslání a volitelně jedno nebo více vstupních polí formuláře. Váš agent ukládá vstup uživatele do proměnných pro pozdější použití v konverzaci.

Note

Copilot Studio podporuje schéma Adaptivní karty verze 1.6 a starší. Příslušná verze schématu ale závisí na cílové hostitelské aplikaci:

Komponenta Webový chat bot Framework (tj. výchozí model integrace webu) podporuje verzi 1.6, ale nepodporuje Action.Execute
Widget živého chatu (používaný pro Omnichannel pro služby zákazníkům) je omezen na verzi 1.5.
Teams je také omezen na verzi 1.5

Kromě toho Copilot Studio vykresluje pouze karty verze 1.6 v testovacím chatu, ne na plátně.

Další informace najdete v AdaptiveCard.

Copilot Studio obsahuje integrovaný návrhář adaptivních karet, který nabízí nejužitečnější funkce z Návrháře adaptivních karet.

Případně můžete:

Pro kartu, kterou chcete zobrazit uživateli, použijte reprezentaci JSON.
Použijte vzorec Power Fx pro zahrnutí dynamických informací na kartu.

Můžete také řídit chování karty, například co dělat, když uživatel zadá neplatnou odpověď, nebo když je uzel přerušen.

Uzel Adaptivní karta je určen pro interaktivní karty, kde se očekává, že uživatel odešle odpověď. Pomocí uzlů Zprávy a Otázky můžete uživateli prezentovat neinteraktivní kartu, která zobrazuje informace.

Tip

Přejmenujte uzly, abyste je snáze identifikovali. Vyberte pole jména uzlu pro přímou aktualizaci jména, nebo vyberte tři tečky (...) uzlu a v menu zvolte Přejmenovat . Můžete také přejmenovat uzly v editoru kódu.

Není možné přejmenovat uzly Trigger a Přejít na krok.

Názvy uzlů mohou mít délku až 500 znaků.

Přidejte uzel adaptivní karty

Vyberte ikonu Přidat uzel pod uzlem, po kterém chcete přidat uzel adaptivní karty, a pak vyberte Požádat s adaptivní kartou.
Vyberte tři tečky (...) uzlu a poté vyberte Vlastnosti.
Na panelu Vlastnosti uzlu adaptivní karty vyberte Upravit adaptivní kartu. Otevře se panel pro návrh adaptivních karet.
Přidejte požadované prvky pro vaši kartu a nakonfigurujte jejich vlastnosti. Případně v podokně Editor datové části karty nahraďte výchozí datovou část literálem JSON pro vaši kartu.

Tip

Vaše karta musí obsahovat alespoň jedno tlačítko Odeslat, protože se musí jednat o interaktivní kartu, která uživateli umožňuje odesílat informace zpět agentovi. Pokud tomu tak není a je určena pouze k zobrazení informací, měli byste adaptivní kartu přidat do uzlu Zpráva.
Až budete s počátečním návrhem hotovi, vyberte Uložit a zavřete panel návrháře. Na uzlu se zobrazí náhled karty. Copilot Studio automaticky vytvoří výstupní proměnné na základě vstupů zadaných v kódu.

Tip

Pokud jsou výstupní proměnné vygenerované pro vaši kartu nesprávné, můžete seznam proměnných a jejich typů aktualizovat ručně výběrem možnosti Upravit schéma na panelu vlastností uzlu adaptivní karty.

Vaše interaktivní adaptivní karta je připravená. Když uživatel agenta vybere tlačítko Odeslat na kartě, výstupní proměnné se naplní informacemi, které uživatel poskytl při interakci s kartou.

Ostatní vlastnosti

Pomocí dalších vlastností můžete řídit chování uzlu adaptivní karty , například:

Jak agent reaguje na neplatnou odpověď
Zda může být přerušen

Pokud agent čeká na odeslání z adaptivní karty a uživatel místo toho pošle textovou zprávu, považuje se tato odpověď za neplatnou, pokud zpráva neaktivuje přerušení. V tomto případě určují chování následující vlastnosti.

Počet opakovaných výzev: Kolikrát se váš agent pokusí získat platné zadání z karty. Výchozí hodnota je Opakovat až 2krát. Můžete také vybrat Opakovat jednou nebo Neopakovat. Při každém opakování je karta znovu zaslána uživateli.
Opakovat prompt: Tuto vlastnost použijte k definování zprávy, která se má odeslat, když dojde k opakování, spolu s opakováním karty. Pokud chcete definovat zprávu opakování, vyberte Přizpůsobit a zadejte novou výzvu.
Povolit přepnutí na jiné téma: Pokud je vybráno (výchozí), příchozí zpráva od uživatele, když agent čeká na odeslání karty, vyvolá přerušení a přepne na jiné téma. Pokud dojde k přepnutí tématu, karta se uživateli odešle znovu, jakmile skončí přerušující téma.

Chování tlačítka Odeslat pro agenty s po sobě jdoucími kartami

Adaptivní karty záměrně umožňují vícekrát vybrat jejich tlačítka pro odeslání. Pokud má agent po sobě jdoucí adaptivní karty a uživatel vybere tlačítko na předchozí kartě, může dojít k neočekávanému chování uživatele.

Pokud chcete zabránit tomu, aby akce odeslání na jedné kartě zasahovala do jiné karty:

Izolovat akce odeslání: Zajistěte, aby každá adaptivní karta, měla svůj vlastní jedinečný identifikátor a zpracovatele akcí.
Použijte akce odeslání s jedinečnými daty: Když definujete akce odeslání pro karty, zahrňte jedinečné identifikátory nebo datové datové části, které pomáhají rozlišovat mezi kartami, když uživatel vybere tlačítko odeslat.
Přidejte do agenta robustní logiku zpracování událostí: Definujte podmínky na základě výrazných identifikátorů nebo prvků datové části přidružených k tlačítkům pro odeslání.
Ladění a protokolování: Přidejte do kódu zpracování událostí vašeho agenta podrobné protokolování, abyste zachytili posloupnost akcí a zjistili, kde vznikají neplánovaná odeslání.

Použijte identifikátor odeslání v Action.Submit data

Pokud váš agent odesílá v konverzaci několik adaptivních karet (například po sobě jdoucí karty, opakování nebo přerušení), mohou uživatelé kliknout na Odeslat na dřívější kartě. Pokud chcete agentovi nebo vlastnímu klientovi pomoct odlišit kartu a akci, ze které přišla odpověď, zahrňte do datové části každé akce odeslání jedinečný identifikátor a při zpracování odpovědi ji ověřte.

Příklad:

{
  "type": "Action.Submit",
  "title": "Confirm",
  "data": {
    "actionSubmitId": "booking_confirm_card_v3_confirm"
  }
}

Tip pro uživatelské rozhraní webového chatu, jak se vyhnout neaktivním kliknutím

Některé chatovací klienty, včetně webových prostředí, můžou nechat dřívější karty klikatelné poté, co uživatel odešle následující kartu. Pokud vytváříte vlastní webový chat, zvažte zakázání tlačítka odeslání po prvním kliknutí nebo aktualizaci předchozí zprávy v kartě, aby se snížila rizika náhodného duplicitního nebo zastaralého odeslání.

Následující příklad ukazuje jeden ze způsobů, jak zakázat Action.Submit tlačítka po prvním kliknutí v přizpůsobeném prostředí webového chatu:

Vykreslení adaptivních karet pomocí sady SDK adaptivních karet nebo jiného rendereru, který vytváří skutečná tlačítka nebo vstupy HTML.
Když obdržíte akci odeslání, okamžitě označte aktuální kartu jako odeslanou v uživatelském rozhraní. Například nastavte submitted příznak na zprávu.
Znovu vykreslete nebo mutujte kartu Document Object Model (DOM), aby byly deaktivovány všechny interaktivní prvky, a poté odešlete datovou část vašemu robotovi nebo službě.
Pokud chat podporuje více karet na konverzaci, opakujte stejný vzor pro každou zprávu karty, aby se zabránilo zastaralým odesláním ze starších karet.

Příklad:

// Example: disable Adaptive Card submit interactions after the first click.
// This is UI-side logic for custom web chat experiences.

// When you render a card, keep a reference to its container element.
// For example, each chat message could render into its own <div>.
function disableCardInteractivity(cardContainer) {
    // Disable buttons (including Action.Submit rendered as <button>).
    for (const el of cardContainer.querySelectorAll('button, input, select, textarea')) {
        el.disabled = true;
        el.setAttribute('aria-disabled', 'true');
    }

    // Optional: prevent click handlers from firing (defense-in-depth).
    cardContainer.addEventListener(
        'click',
        (evt) => {
            const target = /** @type {HTMLElement} */ (evt.target);
            if (target && target.closest && target.closest('button, input, select, textarea')) {
                evt.preventDefault();
                evt.stopPropagation();
            }
        },
        true
    );
}

// Wire the behavior into your Adaptive Cards host.
// The Adaptive Cards SDK surfaces submits via onExecuteAction.
function wireCardSubmitHandling(adaptiveCard, cardContainer, sendToBot) {
    let submitted = false;

    adaptiveCard.onExecuteAction = async (action) => {
        // Only allow the first submit from this card instance.
        if (submitted) {
            return;
        }
        submitted = true;

        // Disable the UI immediately to avoid duplicate/stale clicks.
        disableCardInteractivity(cardContainer);

        // Send the submit payload to your bot/service.
        // If you're using Action.Submit with a unique ID (for example, actionSubmitId),
        // include it in the payload so your bot can de-duplicate safely.
        await sendToBot({
            type: 'adaptiveCard/submit',
            data: action && action.data ? action.data : {},
            verb: action && action.verb ? action.verb : undefined
        });
    };
}

Použijte Power Fx, aby byla vaše karta dynamická

Můžete použít vzorec Power Fx k zahrnutí dynamické informace na vaší kartě odkazem na proměnné z vašeho tématu nebo agenta.

Vyberte tři tečky (...) uzlu a poté vyberte Vlastnosti.

V panelu vlastnosti uzlu adaptivní karty se přepněte na Vzorec. Výběr vzorce automaticky převede reprezentaci JSON vaší karty na vzorec Power Fx.

Snímek obrazovky s možností přepnout na vzorec Power Fx místo JSON na panelu vlastností uzlu adaptivní karty.

Začněte, například následujícím literálem JSON pro kartu:

{
  "$schema": "http://adaptivecards.microsoft.com/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.5",
  "body": [{
      "type": "ColumnSet",
      "columns": [{
          "type": "Column",
          "width": 2,
          "items": [{
              "type": "TextBlock",
              "text": "Tell us about yourself",
              "weight": "Bolder",
              "size": "Medium",
              "wrap": true,
              "style": "heading"
            }, {
              "type": "TextBlock",
              "text": "We just need a few more details to get you booked for the trip of a lifetime!",
              "isSubtle": true,
              "wrap": true
            }, {
              "type": "Input.Text",
              "id": "myName",
              "label": "Your name (Last, First)",
              "isRequired": true,
              "regex": "^[A-Z][a-z]+, [A-Z][a-z]+$",
              "errorMessage": "Please enter your name in the specified format"
            }
          ]
        }
      ]
    }
  ],
  "actions": [{
      "type": "Action.Submit",
      "title": "Submit"
    }
  ]
}

Tady je výsledný vzorec Power Fx, který místo pevně zakódovaného textu z literálu JSON používá dvě proměnné Topic.Title a Topic.Subtitle. (V tomto příkladu se předpokládá, že proměnné jsou definovány ve vašem tématu.)

{
  '$schema': "http://adaptivecards.microsoft.com/schemas/adaptive-card.json",
  type: "AdaptiveCard",
  version: "1.5",
  body: [
    {
      type: "ColumnSet",
      columns: [
        {
          type: "Column",
          width: "2",
          items: [
            {
              type: "TextBlock",
              text: Topic.Title,
              weight: "Bolder",
              size: "Medium",
              wrap: true,
              style: "heading"
            },
            {
              type: "TextBlock",
              text: Topic.Subtitle,
              isSubtle: true,
              wrap: true
            },
            {
              type: "Input.Text",
              id: "myName",
              label: "Your name (Last, First)",
              isRequired: true,
              regex: "^[A-Z][a-z]+, [A-Z][a-z]+$",
              errorMessage: "Please enter your name in the specified format"
            }
          ]
        }
      ]
    }
  ],
  actions: [
    {
      type: "Action.Submit",
      title: "Submit"
    }
  ]
}

Important

Jakmile začnete upravovat na panelu vzorců, nemůžete se vrátit k původnímu kódu JSON. Pokud chcete povolit iterativní návrh a změny, uložte kopii původního JSON do vlastních poznámek nebo jako komentář v uzlu. Toto opatření vám pomůže vrátit změny v případě potřeby zpět.

Váš názor

Byla tato stránka užitečná?

Last updated on 2026-06-03