Раньше я мог передавать параметры Username и UserID из URI, используя следующий код в веб-чате:

    var queryString = window.location.search;
    var urlParams = new URLSearchParams(queryString);
    var user = urlParams.get('userid')
    var usern = urlParams.get('username')

И я передаю его в веб-чат, используя следующий код:

    window.WebChat.renderWebChat({
        directLine: window.WebChat.createDirectLine({ token: }),
        store,
        userID: user,
        username: usern,
        styleOptions
    }, document.getElementById('webchat'));
    document.querySelector('#webchat > *').focus();

Теперь это прекрасно работает раньше, когда я использовал обычный веб-чат для Botframework. Он больше не работает, когда я начал использовать ReachJS в веб-чате. Как передать этот параметр с помощью API-интерфейса Webchat Hooks? Я попытался указать его, используя приведенный ниже код, но не работает.

ReactDOM.render(
      <Composer directLine={window.WebChat.createDirectLine({ token: })}>
        <BasicWebChat />
        <SendMessageOnConnect />
        <user />
        <usern />
      </Composer>,
      document.getElementById('webchat')
    );
0
samueljohnpaul 27 Авг 2020 в 15:50

2 ответа

Лучший ответ

Это работает в моем проекте React. Ваша реализация отличается, но это должно направить вас в правильном направлении. В перечисленных действиях вы можете видеть, что пользователь name обновлен до "Steve". В моем случае id не обновляется, потому что я генерирую идентификатор с токеном. Когда идентификатор создается через прямую линию с токеном, он имеет приоритет над любым идентификатором, переданным через веб-чат.

import React from 'react';
import ReactWebChat, { createDirectLine } from 'botframework-webchat';

export default class WebChatView extends React.Component {
  constructor(props) {
    super(props);
    
    this.state = {
      user: '',
      usern: ''
    };
  }

  componentDidMount() {
    var queryString = window.location.search;
    var urlParams = new URLSearchParams(queryString);
    var user = urlParams.get('userid');
    var usern = urlParams.get('username');
    this.setState({ user: user, usern: usern })
    this.fetchToken();
  }
  
  async fetchToken() {
    const res = await fetch('http://localhost:3500/directline/token', { method: 'POST' });
    const { token } = await res.json();

    this.setState(() => ({
      directLine: createDirectLine({ token: token })
    }));
  }

  render() {
    return (
      this.state.directLine ?
        <ReactWebChat
          directLine={this.state.directLine}
          userID={this.state.user}
          username={this.state.usern}
        />
        :
        <div>Connecting to bot&hellip;</div>
    )
  }
}

Результат активности:

{
  type: 'message',
  id: '4wpfp......-f|0000002',
  timestamp: 2020-09-02T21:39:01.197Z,
  serviceUrl: 'https://directline.botframework.com/',
  channelId: 'directline',
  from: { id: 'dl_15990824712200.ruhpue7p1j', name: 'Steve', role: 'user' },
  conversation: { id: '4wpfp......-f' },
  recipient: { id: 'botberg@QaeuoeEamLg', name: 'Bot' },      
  textFormat: 'plain',
  locale: 'en-US',
  text: 'Hi',
  entities: [
    {
      type: 'ClientCapabilities',
      requiresBotState: true,
      supportsListening: true,
      supportsTts: true
    }
  ],
  channelData: {
    clientActivityID: '1599082740974mexnvax1jq',
    clientTimestamp: '2020-09-02T21:39:00.974Z'
  },
  rawTimestamp: '2020-09-02T21:39:01.1971653Z',
  callerId: 'urn:botframework:azure'
}

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

1
Steven Kanberg 2 Сен 2020 в 21:45

Вы можете попробовать использовать перехватчик useParams() вместо этого:

let { userid, username } = useParams();

Или переименуйте как следующее:

let { userid: user, username: usern } = useParams();

Читайте далее в документации здесь, в которой говорится:

useParams возвращает объект пар ключ / значение параметров URL. Используйте его для доступа к match.params текущего <Route>.

Или вы также можете использовать useLocation() как:

const { search } = useLocation();
const { userid, username } = search;

Прочтите документацию:

Хук useLocation возвращает объект местоположения, который представляет текущий URL. Вы можете думать об этом как о useState, которое возвращает новое местоположение при изменении URL.

1
norbitrial 27 Авг 2020 в 13:04