Przykład 1 — pokazywanie karty adaptacyjnej w aplikacji Microsoft Copilot Studio

Artykuł
04/08/2024

Ważne

Możliwości i funkcje Power Virtual Agents są teraz częścią Microsoft Copilot Studio w wyniku znacznych inwestycji w generatywną AI i poprawioną integracje z Microsoft Copilot.

Niektóre artykuły i zrzuty ekranów mogą odwoływać się do Power Virtual Agents podczas aktualizowania dokumentacji i zawartości szkoleniowej.

Uwaga

Usługa Microsoft Copilot Studio teraz obsługuje te funkcje bez aplikacji Composer.

Udoskonalaj swojego bota, tworząc własne okna dialogowe za pomocą Bot Framework Composer, a następnie dodając je do swojego bota Microsoft Copilot Studio.

W tym przykładzie dowiesz się, jak wyświetlić kartę adaptacyjną w Microsoft Copilot Studio za pomocą Composera.

Ważne

Integracja aplikacji Composer nie jest dostępna dla użytkowników posiadających tylko licencję Teams w usłudze Microsoft Copilot Studio. Wymagana jest licencja wersji próbnej lub pełna licencja usługi Microsoft Copilot Studio.

Wymagania wstępne

Utwórz nowy temat

W usłudze Microsoft Copilot Studio utwórz nowego bota o nazwie Contoso Meal Delivery Service.
Wróć do strony Tematy i utwórz nowy temat o nazwie Meal delivery options.

Skopiuj i wklej następujące frazy wyzwalające:

what meals can I order
what meal options do you have
what dishes do you deliver
entrees available for delivery

Na kanwie tworzenia wybierz domyślny węzeł Wiadomość. Wybierz trzy kropki w pionie, a następnie wybierz opcję Usuń.
W węźle Frazy wyzwalające wybierz pozycję Dodaj węzeł (+) i wybierz pozycję Zadaj pytanie. Następnie w węźle Pytanie:
1. W obszarze Zadaj pytanie wprowadź What city are you in?.
2. W obszarze Identyfikuj wybierz Miasto.
W obszarze Zapisz odpowiedź jako wybierz automatycznie tworzoną zmienną. Następnie w okienku właściwości zmiennej:
1. W polu Nazwa wprowadź user_city.
2. W polu Użycie wybierz opcję Bot (dowolny temat może mieć dostęp).
Wybierz pozycję Zapisz.

Zmienna usługi Microsoft Copilot Studio.

Tworzenie karty adaptacyjnej

Następnie wyświetlisz obrazy z posiłkami wyboru, które są dostępne w mieście użytkownika, przy użyciu aplikacji Composer.

Otwórz bota w aplikacji Composer. Aby uzyskać instrukcje dotyczące tej czynności, zobacz Rozpoczynanie pracy z aplikacją Bot Framework Composer.
Przejdź na stronę Tworzenie. W bocie wybierz pozycję Więcej opcji (...), a następnie wybierz + Dodaj sesję dialogową.
W polu Nazwa wprowadź Meals, a następnie wybierz przycisk OK.
Przejdź na stronę Odpowiedzi bota. W eksploratorze botów wybierz pozycję Meals, a następnie Pokaż kod.

W widoku kodu skopiuj i wklej następującą odpowiedź bota. Następnie zastąp trzy przykładowe adresy URL obrazów własnymi.

# Chicken()
-Chicken

# Steak()
-Steak

# Tofu()
-Tofu

# SteakImageURL()
-https://www.example.com/steak.jpg

# ChickenImageURL()
-https://www.example.com/chicken.jpg

# TofuImageURL()
-https://www.example.com/tofu.jpg

Karta Odpowiedzi bota z ciągami w aplikacji Composer.

Skopiuj i wklej następujący kod w tym samym widoku kodu, aby dodać kartę adaptacyjną, na której są wyświetlane trzy obrazy.

# adaptivecardjson_meals(location)
- ```
{
    "type": "AdaptiveCard",
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.1",
    "body": [
            {
            "type": "TextBlock",
            "text": "Meal delivery options for ${location}:",
            "size": "Medium",
            "weight": "Bolder"
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "Image",
                            "url": "${SteakImageURL()}",
                            "size": "Stretch",
                            "spacing": "Medium",
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "Image",
                            "url": "${ChickenImageURL()}",
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "Image",
                            "url": "${TofuImageURL()}",
                            "horizontalAlignment": "Center"
                        }
                    ]
                }
            ]
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "${Steak()}",
                            "wrap": true,
                            "horizontalAlignment": "Center"                            
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "${Chicken()}",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "${Tofu()}",
                            "wrap": true,
                            "horizontalAlignment": "Center"
                        }
                    ]
                }
            ]
        }
    ]
}
```

Karta Odpowiedzi bota w aplikacji Composer — dane JSON karty adaptacyjnej.

Skopiuj i wklej następujący kod w tym samym widoku kodu, aby dodać działanie, które spowoduje wyświetlenie karty adaptacyjnej.
```
# AdaptiveCardMeals(location)
[Activity
    Attachments = ${json(adaptivecardjson_meals(location))}
]
```

Wyświetlanie karty adaptacyjnej

Przejdź na stronę Tworzenie. W eksploratorze botów wybierz sesję dialogową Meals, a następnie wybierz wyzwalacz BeginDialog.
Na kanwie tworzenia wybierz pozycję Dodaj (+), a następnie wybierz Zadaj pytanie.
Wybierz nowy węzeł Wyślij odpowiedź, aby otworzyć okienko właściwości. W sekcji Odpowiedzi bota wybierz Pokaż kod, aby przejść do edytora kodu.

Ostrzeżenie

Dodanie w następnym kroku poniższego wyrażenia do edytora response zamiast edytora code spowoduje, że bot odpowie przy użyciu nieprzetworzonych danych JSON zamiast karty adaptacyjnej.
Skopiuj poniższe wyrażenie i wklej je w tym samym edytorze kodu.
```
- ${AdaptiveCardMeals(virtualagent.user_city)}
```
Zmienne globalne Microsoft Copilot Studio są dostępne w aplikacji Composer przy użyciu zakresu virtualagent. Ten zakres nie będzie widoczny w menu odwołania do właściwości aplikacji Composer, ale można do niego przejść, wprowadzając bezpośrednio wyrażenie.

W tym przykładzie ${virtualagent.user_city} odwołuje się do zmiennej globalnej user_city, która została utworzona w bocie Microsoft Copilot Studio .

Publikowanie zawartości

Opublikuj zawartość aplikacji Composer, aby udostępnić ją w bocie usługi Microsoft Copilot Studio .

Ważne

Wybranie pozycji Opublikuj w aplikacji Composer powoduje udostępnienie zmian na potrzeby testowania, ale nie powoduje automatycznego opublikowania bota.

Opublikuj bota w usłudze Microsoft Copilot Studio w celu zaktualizowania bota we wszystkich kanałach, z którymi jest połączony.
W usłudze Microsoft Copilot Studio przejdź do strony Tematy, aby zobaczyć nowy temat Meals.
Otwórz temat Meal delivery options.
W węźle Pytanie wybierz pozycję Dodaj węzeł (+). Wybierz pozycję Przekieruj do innego tematu, a następnie wybierz opcję Meals.
Wybierz pozycję Zapisz, aby zapisać zmiany tematu.

Przetestuj swojego bota

Aby przetestować zmiany w Microsoft Copilot Studio, otwórz okienko Testowanie bota i upewnij się, że śledzenie między tematami jest włączone. Wprowadź wiadomość What meals do you deliver?, aby rozpocząć rozmowę.

Twój bot wyzwoli temat Meal delivery options, który pyta użytkownika o bieżące miasto. Następnie bot przekieruje Cię do sesji dialogowej aplikacji Composer Meals , aby wyświetlić kartę adaptacyjną.

Przykład 1 w usłudze Microsoft Copilot Studio — testowanie.

Następne kroki

Przykład 2 — wyświetlanie listy opcji wyboru wielokrotnego w aplikacji Microsoft Copilot Studio.

Share via