Поделиться через


Автоматически начать разговор агент

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

Внимание!

Если начать разговор с хэштега агент, это отобразится в вашей аналитике и увеличит количество сеансов.

Если пользователь вашего агент не взаимодействует с агент (например, загружает страницу, но ничего не спрашивает у агент), сеанс помечается как неактивный сеанс. Это может повлиять на вашу аналитику.

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

Однако вы можете использовать пользовательский код CSS и код JavaScript, чтобы агент автоматически начинал диалог при загрузке агент. Например, вы можете сделать так, чтобы ваш агент сказал: «Привет, я Botty, виртуальный агент» сразу после загрузки агент.

Во-первых, вам нужно развернуть пользовательский холст, включающий аргументы, которые запускают приветствие. По умолчанию пользовательский холст вызывает системную тему приветствия по умолчанию. Однако вы можете создать новую тему, которая будет использоваться в качестве приветствия. Вам нужно перенаправить системную тему приветствия по умолчанию на новую тему.

Внимание

Вы можете установить и использовать пример кода, включенный в эту документацию, только для использования с Copilot Studio продуктом. Образец кода лицензируется "как есть" и исключается из любых соглашений об уровне обслуживания или служб поддержки. Вы берете на себя все риски, связанные с использованием сведений, приводящихся в данном документе.

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

Извлечение конечной точки токена

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

  1. В меню навигации в разделе Параметры выберите Каналы.

  2. Выберите Мобильное приложение.

    Снимок экрана: плитка канала мобильного приложения.

  3. Рядом с пунктом Конечная точка токена выберите Копировать.

    Снимок экрана: идентификатор токена конечной точки.

Настройка холста по умолчанию (простая)

Вы можете настроить внешний вид холста чата с помощью простых параметров стилей CSS и JavaScript.

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

  1. Создайте и опубликуйте агент.

  2. Скопируйте и вставьте приведенный здесь HTML-код и сохраните его как index.html.
    Вы также можете скопировать и вставить этот код в пробный редактор HTML w3schools.com. Вам все равно нужно добавить свою конечную точку токена.

    <!DOCTYPE html>
    <html>
    <head>
        <title>Contoso Sample Web Chat</title> 
        <!-- This styling is for the Web Chat demonstration purposes. It is recommended that style is moved to a separate file for organization in larger projects -->
        <style>
            html, body {
                height: 100%;
            }
    
            body {
                margin: 0;
            }
    
            h1 {
                font-size: 16px;
                font-family: Segoe UI;
                line-height: 20px;
                color: whitesmoke;
                display: table-cell;
                padding: 13px 0px 0px 20px;
            }
    
            #heading {
                background-color: black;
                height: 50px;
            }
    
            .main {
                margin: 18px;
                border-radius: 4px;
            }
    
            div[role="form"]{
                background-color: black;
            }
    
            #webchat {
                position: fixed;
                height: calc(100% - 50px);
                width: 100%;
                top: 50px;
                overflow: hidden;
            }
    
        </style>
    
    </head>
    <body>
        <div>
            <div id="heading">
                <!-- Change the h1 text to change the bot name -->    
                <h1>Contoso Bot Name</h1>
            </div>
            <div id="webchat" role="main"></div>
        </div>    
    
      <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
    
      <script>
            const styleOptions = {
    
               // Add styleOptions to customize Web Chat canvas
               hideUploadButton: true
            };
    
            // Add your BOT token endpoint below
            var theURL = "<BOT TOKEN ENDPOINT>";
    
            var environmentEndPoint = theURL.slice(0,theURL.indexOf('/powervirtualagents'));
            var apiVersion = theURL.slice(theURL.indexOf('api-version')).split('=')[1];
            var regionalChannelSettingsURL = `${environmentEndPoint}/powervirtualagents/regionalchannelsettings?api-version=${apiVersion}`; 
    
            var directline;
                fetch(regionalChannelSettingsURL)
                    .then((response) => {
                        return response.json();
                        })
                    .then((data) => {
                        directline = data.channelUrlsById.directline;
                        })
                    .catch(err => console.error("An error occurred: " + err));
    
          fetch(theURL)
                .then(response => response.json())
                .then(conversationInfo => {
                    window.WebChat.renderWebChat(
                        {
                            directLine: window.WebChat.createDirectLine({
                                domain: `${directline}v3/directline`,
                                token: conversationInfo.token,
                            }),
                            styleOptions
                        },
                        document.getElementById('webchat')
                    );
                })
                .catch(err => console.error("An error occurred: " + err));
    
        </script>
      </body>
    </html>
    
  3. В файле index.html, который вы создали, введите свою конечную точку токена в строке var theURL = "<YOUR TOKEN ENDPOINT>";.

  4. Откройте index.html с помощью современного браузера (например, Microsoft Edge), чтобы открыть агент в пользовательском холсте.

  5. Протестируйте агент, чтобы убедиться, что вы получаете ответы от вашего агент и что агент работает правильно.

    Если у вас возникли проблемы, убедитесь, что вы опубликовали свой агент и что ваш токен конечная точка вставлен в правильное место. Конечная точка токена должна быть после знака равенства (=) в строке var theURL = "<YOUR TOKEN ENDPOINT>" и в двойных кавычках (").

Изменить приветствие по умолчанию агент

Код в файле index.html заставляет тема вызываться автоматически при загрузке агент. По умолчанию этот код вызывает системную тему приветствия. Вы также можете создать новую тему и перенаправить системную тему приветствия по умолчанию на эту новую тему.

В обоих случаях вы внесите изменения в тему, которую вы хотите вызвать, как обычно.

Если вы изменяете или создаете новое приветствие тема, вам следует включить какое-либо указание на то, что пользователь общается с агент (или "виртуальный агент"). Такая индикация поможет пользователю понять, что он разговаривает не с человеком.

Мы рекомендуем вам изменить системную тему приветствия, чтобы вам не приходилось редактировать код файла index.html.

  1. В меню навигации выберите Темы, затем выберите строку темы Приветствие.

    Снимок экрана на странице quot;Темыquot; с выделенной темой quot;Приветствиеquot;.

  2. Измените текст внутри узлов Сообщение. Вы также можете добавить или удалить дополнительные узлы.

  3. Выберите Сохранить.

  4. Опубликуйте свой агент.

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

Создание новой пользовательской темы

Предупреждение

Используя пользовательскую тему для начала разговора увеличит количество ваших оплачиваемых сеансов. Платный сеанс — это взаимодействие между клиентом и агент, представляющее собой одну единицу потребления. Оплачиваемый сеанс начинается, когда запускается тема пользователя. Для получения дополнительной информации см. Просмотр оплачиваемых сеансов (предварительная версия).

  1. В меню навигации выберите Темы.

  2. Выберите Новая тема и задайте ей имя.

  3. Добавьте текст внутрь узла Сообщение.

  4. Выберите Сохранить, когда завершите редактирование сообщения.

  5. В меню навигации выберите Темы, затем выберите строку темы Приветствие.

  6. Удалите узлы сообщения в теме Приветствие.

  7. Чтобы автоматически перенаправить агент пользователю тема, выберите Добавить узел (+), чтобы добавить узел, а затем Перейти к другому тема.

  8. Во всплывающем меню выберите пользовательскую тему, которую вы создали выше.

  9. Выберите Сохранить, когда завершите редактирование сообщения.

  10. Опубликуйте свой агент.

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