Как сделать так, чтобы значение BotAvatarImage было прочитано так, чтобы изображение было частью самого решения в веб-канале BotFramework SDKV4? - PullRequest
3 голосов
/ 13 апреля 2020

Я создал чат BOT, используя Microsoft Bot Framework SDK V4 в C# и канал в Web Channel, в рамках которого я создал индексную страницу. html, используя учебные пособия и другие публикации. Я могу предоставить изображение BotAvatar как URL, и это работает совершенно хорошо, но я хочу, чтобы значение изображения было присвоено этому, где изображение является частью самого решения.

Значение в данном BOt проект, у нас есть папка BOT, папка диалога и папка wwwroot, кроме этого у меня есть файл изображения.

Я хочу, чтобы этот файл изображения читался как BOtAvatarimage при открытии индекса. html после публикации в Azure.

Текущий HTML У меня есть

<!DOCTYPE html>
<html lang="en-US">
<head>
    <title>Engineering Bot</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--
      For demonstration purposes, we are using the development branch of Web Chat at "/master/webchat.js".
      When you are using Web Chat for production, you should use the latest stable release at "/latest/webchat.js",
      or lock down on a specific version with the following format: "/4.1.0/webchat.js".
    -->
    <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat-es5.js"></script>
    <style>
        html, body {
            height: 100%
        }

        body {
            margin: 0
        }

        #webchat {
            height: 100%;
            width: 100%;
        }

        .navbar {
            overflow: hidden;
            background-color: #333;
            position: fixed;
            top: 0;
            width: 100%;
        }

            .navbar a {
                float: left;
                display: block;
                color: #f2f2f2;
                text-align: center;
                padding: 14px 16px;
                text-decoration: none;
                font-size: 17px;
            }

                .navbar a:hover {
                    background: #ddd;
                    color: black;
                }

        .floating {
            padding: 16px;
            margin-top: 30px;
            height: 1500px; /* Used in this example to enable scrolling */
        }
    </style>
</head>
<body>
    <div id="webchat" role="main">
    </div>

    <script>
        const token = 'Token value';

        const styleOptions = {
            hideUploadButton: true,
            botAvatarImage: 'ImageUrl',
            botAvatarInitials: 'BF',
            userAvatarImage: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTXFpBTkKBW7JgYuePzhVoGkDDdZLVKQMZDbgy6j3C0sWvkkH1-',
            userAvatarInitials: 'WC',
            bubbleBackground: 'rgba(0, 0, 255, .1)',
            bubbleFromUserBackground: 'rgba(0, 255, 0, .1)'
        };
        var d = new Date();
        var tzoffset = d.getTimezoneOffset();
        const store = window.WebChat.createStore(
            {},
            function (_ref) {
                const dispatch = _ref.dispatch;
                return function (next) {
                    return function (action) {
                        if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
                            dispatch({
                                type: 'WEB_CHAT/SEND_EVENT',
                                payload: {
                                    name: 'webchat/join',
                                    value: tzoffset.toString()
                                }
                            });
                        }
                        return next(action);
                    };
                };
            });

        window.WebChat.renderWebChat({
            directLine: window.WebChat.createDirectLine({ token: token }),
            styleOptions: styleOptions,
            store: store,
            webSpeechPonyfillFactory: window.WebChat.createBrowserWebSpeechPonyfillFactory()
        }, document.getElementById('webchat'));
        document.querySelector('#webchat > *').focus();
    </script>
</body>
</html>

Теперь, если мы наблюдаем в приведенном выше сценарии, изображение BOT Avatar, которое мы обычно даем URL-адрес изображения, позволяет сказать, что URL-адрес изображения Google предоставляется. Если я дам URL-адрес изображения Google, он прекрасно работает. Теперь я хочу указать путь к изображению, который является частью самого решения / проекта.

Я попробовал следующее:

botAvatarImage: '. \ Lo go .png'

Создана папка с изображениями и предоставлено значение как:

botAvatarImage: '. \ Image \ Lo go .png'

Ничего из этого не сработало.

Это правильное ожидание, можем ли мы предоставить изображение, которое является частью BOT-решения или самого проекта? Если да, то как / в каком формате следует указывать значение, указанное мной, не работает?

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