Это легко сделать, используя метод createStore().
В скрипте веб-чата, расположенном на вашей странице, создайте магазин, используя вышеуказанный метод. В нем сопоставьте action.type с 'WEB_CHAT / SEND_MESSAGE'. Это будет захватывать каждое сообщение, переданное через компонент веб-чата, до его отображения.
Помните, что этот измененный текст (или любое другое значение, которое вы изменяете) - это то, что отправляется боту. action является корневым объектом. action.payload, по сути, представляет деятельность. Здесь вы найдете текстовое значение и т. Д.
В операторе if выполните все необходимые изменения, а затем верните объект action.
Наконец, включите объект store в компонент renderWebChat. Это должно настроить вас.
В приведенном ниже примере я добавляю текст в текстовое поле, изменяя его перед его отображением и отображением.
<script>
( async function () {
const res = await fetch( 'http://somesite/directline/token', { method: 'POST' } );
const { token } = await res.json();
// We are using a customized store to add hooks to connect event
const store = window.WebChat.createStore( {}, ( { dispatch } ) => next => action => {
if ( action.type === 'WEB_CHAT/SEND_MESSAGE' ) {
action.payload.text = action.payload.text + ' (Hello from behind the curtain)'
}
return next( action );
} );
window.WebChat.renderWebChat( {
directLine: window.WebChat.createDirectLine( { token } ),
userID: 'user123',
username: 'johndoe',
botAvatarInitials: 'BB',
userAvatarInitials: 'JD',
store
}, document.getElementById( 'webchat' ) );
document.querySelector( '#webchat > *' ).focus();
} )().catch( err => console.error( err ) );
</script>
Надежда на помощь!