如何在React组件中拦截来自Chatbot的消息？ （微软botframework-webchat）

Question

我必须根据Chatbot提供的回复运行音轨（mp3文件）。所以我需要从我的React组件（或使用纯JS）中识别来自chatbot的回复。我怎样才能做到这一点？

Answer 1

您可以通过在Github上搜索网络聊天库来快速找到所需内容。

如果你搜索incoming，你会转到这些可能对你有用的lines：

private handleIncomingActivity(activity: Activity) {
    let state = this.store.getState();
    switch (activity.type) {
        case "message":
            this.store.dispatch<ChatActions>({ type: activity.from.id === state.connection.user.id ? 'Receive_Sent_Message' : 'Receive_Message', activity });
            break;

        case "typing":
            if (activity.from.id !== state.connection.user.id)
                this.store.dispatch<ChatActions>({ type: 'Show_Typing', activity });
            break;
    }
}

Answer 2

谢谢@Nicolas R 。我更改了handleIncomingActivity（）函数，如下所示，并将 activity.text 值发送到我的chatbot react组件，作为使用回调从child（Chat.js）向父（我的反应组件）发送数据。这里，giveTextForBot（）是一个回调函数，用于将chatbot组件作为支柱进行反应。

Chat.prototype.handleIncomingActivity = function (activity) {
        var state = this.store.getState();
        switch (activity.type) {
            case "message":
                this.store.dispatch({ type: activity.from.id === state.connection.user.id ? 'Receive_Sent_Message' :'Receive_Message' , activity: activity });
                if(activity.from.id === "<appName>"){
                    this.props.giveTextForBot(activity.text);
                   }             
            break;
            case "typing":
                if (activity.from.id !== state.connection.user.id)
                    this.store.dispatch({ type: 'Show_Typing', activity:activity });
                break;
        }
};