BotFramework Webchat v4 Отправка сообщения обратно через javascript - PullRequest
2 голосов
/ 30 января 2020

Мне нужна помощь, используя webchat v4 от BotFramework от Microsoft, чтобы отправить сообщение обратно в бот через Javascript.

Мой код бота написан на C# (. NET Framework) но в какой-то момент в моем сценарии мне нужно вызвать javascript, чтобы запросить местоположение у пользователя. Что мне делать?

  1. Я отправляю активность типа event
  2. В магазине от бота я ловлю сказанное активность (вот мой код):
const store = window.WebChat.createStore({},
    ({ dispatch }) => next => action => {
        //console.log('action of type ' + action.type);

        if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
            var activityOut = action.payload.activity;

            if (activityOut.type === 'message') {
                // Store message

                return next(action);
            }

            if (activityOut.type === 'event') {
                // Handle based on event type
                if (activityOut.name === 'getLocation') {
                    if (navigator.geolocation)
                    {
                        navigator.geolocation.getCurrentPosition(showPosition);
                    }
                    else
                    { 
                        console.log("Geolocation is not supported by this browser.");
                    }
                } else {
                    return next(action);
                }
            }
        }
        else if (action.type === 'DIRECT_LINE/POST_ACTIVITY') {
            var activityIn = action.payload.activity;

            if (activityIn.type === 'message') {
                // Store message
            }

            return next(action);
        }
        else {
            return next(action);
        }
    });
Я отправляю информацию боту (здесь местоположение):
function showPosition(position) {
    console.log("Latitude: " + position.coords.latitude + " Longitude: " + position.coords.longitude);

    var v = position.coords.latitude +';' + position.coords.longitude;
    store.dispatch({
        type: 'WEB_CHAT/SEND_MESSAGE_BACK',
        payload:
        {
            text: v,
            value : v
        }
    });
}

Я также пытался использовать 'WEB_CHAT / SEND_MESSAGE', но это ничего не меняет.

Для получения дополнительной информации, вот мой кусок кода для подключения к боту:

window.WebChat.renderWebChat(
            {
                directLine: window.WebChat.createDirectLine({
                    secret: 'my secret (will change to a token of course)'
                }),
                store,
                userID: chatUser.id,
                username: chatUser.name,
                locale: 'fr-FR',
                styleOptions
            },
            document.getElementById('BotChatGoesHere')
        );

Вот исключение, которое я получаю, когда делаю это: Console error Activity send

Спасибо уже всем, кто мне поможет!

1 Ответ

1 голос
/ 08 февраля 2020

Я думаю, что вы немного перегружаете код. Все, что вам нужно сделать, это отфильтровать входящее событие и затем вызвать вашу функцию. См. Пример ниже.

диалоговое окно. js (пример узла-бота): Отправка простого события в качестве шага водопада. Свойство 'name', по которому я буду фильтровать, присваивается channelData.

async eventStep ( stepContext ) {
  let reply = { type: ActivityTypes.Event };
  reply.channelData = { name: 'getLocation' };

  await stepContext.context.sendActivities( reply );
  return await stepContext.next();
}

createStore (): Я фильтрую по типу event входящих операций. Если свойство channelData содержит name с правильным значением, то вызывается функция showPosition.

const store = window.WebChat.createStore( {}, ( { dispatch } ) => next => async action => {
  if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
    const { activity } = action.payload;

    if ( activity.type === 'event' ) {
      // Handle based on event type
      if ( activity.channelData.name === 'getLocation' ) {
        if ( navigator.geolocation ) {
          await navigator.geolocation.getCurrentPosition( showPosition );
        }
        else {
          console.log( "Geolocation is not supported by this browser." );
        }
      }
    }
  }

  return next(action);
});

showPosition (): Я располагаю функцию сразу после веб-чат рендерер. Я также демонстрирую отправку SEND_MESSAGE, SEND_MESSAGE_BACK, SEND_POST_BACK и SEND_EVENT. Как данные организованы в упражнении, отличается в каждом случае. См. Ниже.

  [...]

  document.getElementById('BotChatGoesHere')
);

function showPosition( position ) {
  const message = "Latitude: " + position.coords.latitude + " Longitude: " + position.coords.longitude;

  store.dispatch( {
    type: 'WEB_CHAT/SEND_MESSAGE',
    payload:
      {
        text: message,
        channelData: { latitude: position.coords.latitude, longitude: position.coords.longitude }
      }
  } );

  store.dispatch( {
    type: 'WEB_CHAT/SEND_MESSAGE_BACK',
    payload:
      {
        text: message,
        value: { latitude: position.coords.latitude, longitude: position.coords.longitude }
      }
  } );

  store.dispatch( {
    type: 'WEB_CHAT/SEND_POST_BACK',
    payload: { value: { latitude: position.coords.latitude, longitude: position.coords.longitude } }
  } );

  store.dispatch( {
    type: 'WEB_CHAT/SEND_EVENT',
    payload:
      {
        name: 'EVENT_GET_POSITION',
        value: { latitude: position.coords.latitude, longitude: position.coords.longitude }
      }
  } );
}

SEND_MESSAGE: отправка сообщения; имеет текстовое поле; отображает пользователю; данные в activity.channelData

enter image description here

SEND_MESSAGE_BACK: отправляется как сообщение; имеет текстовое поле; НЕ отображается пользователю; данные в activity.value

enter image description here

SEND_POST_BACK: отправляется как сообщение; не имеет текстового поля; НЕ отображается пользователю; данные в activity.value

enter image description here

SEND_EVENT: отправляется как событие; не имеет текстового поля; НЕ отображается пользователю; название события в activity.name и данные в activity.value

enter image description here

Надеюсь на помощь!

...