0

每当我在我的 React Native App 上发送消息时,我都会收到此错误:

Unhandled promise rejection: TypeError: undefined is not an object (evaluating 'result.queryResult.fulfillmentMessages')
at node_modules\react-native\node_modules\promise\setimmediate\core.js:37:13 in tryCallOne
at node_modules\react-native\node_modules\promise\setimmediate\core.js:123:24 in setImmediate$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:130:14 in _callTimer
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:181:14 in _callImmediatesPass
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:441:30 in callImmediates
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:387:6 in __callImmediates
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:135:6 in __guard$argument_0
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in __guard
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:134:4 in flushedQueue
at [native code]:null in flushedQueue
at [native code]:null in invokeCallbackAndReturnFlushedQueue

我应该至少收到 Dialogflow 中设置的默认响应,但似乎该应用程序实际上并未连接到 Dialogflow。我创建了一个服务帐户和密钥,并将密钥元素复制到了一个 env.js 文件中。一旦我在聊天机器人 UI 中发送消息,就会出现此错误。

编辑: 我注意到我的 result.queryResult 是未定义的。我不知道如何解决这个问题。我遵循了本教程:https ://blog.jscrambler.com/build-a-chatbot-with-dialogflow-and-react-native/

聊天.js

import React, { Component } from 'react'; 
import { StyleSheet, Text, View, Image } from 'react-native';
import { GiftedChat } from 'react-native-gifted-chat';
import {
    firebase,
    firebaseConfig,
    db,
    getUserDocument,
    realtime, 
  } from "../../firebase/config";
  import "firebase/auth";
  import "firebase/firestore";
  import "firebase/database";
  import { dialogflowConfig } from '../../../env'; //configuration object 
  import { Dialogflow_V2 } from 'react-native-dialogflow';

  const user = firebase.auth().currentUser;
  const MT_BOT =  {
        _id: 2,
        name: 'React Native',
        avatar:'https://www.nicepng.com/png/detail/359-3591844_svg-free-stock-african-american-women-clipart-african.png',
  }

export default class Chat extends React.Component {

    state = {
        messages: [ 
            {
                _id: 1,
                text: 'Hi, how can I help you?', //in the component's state, there is one message when the component is rendered intially
                createdAt: new Date(), //display current time and date in the chat UI
                user: MT_BOT
            }
        ]
    }

    componentDidMount() { //lifecycle method to set the configuration of Dialogflow
        Dialogflow_V2.setConfiguration (
            dialogflowConfig.client_email,
            dialogflowConfig.private_key,
            Dialogflow_V2.LANG_ENGLISH_US,
            dialogflowConfig.project_id
        );
    }

    handleGoogleResponse(result) {
        let text = result.queryResult.fulfillmentMessages[0].text.text[0]; //extract a word from result
        this.sendBotResponse(text);
    }

    onSend(messages = []) { //once user clicks "send", their message gets stored in state variable
        this.setState(previousState => ({
            messages: GiftedChat.append(previousState.messages, messages),
        }))

        let message = messages[0].text;
        Dialogflow_V2.requestQuery( //sends request to Dialogflow, w 3 parameters
            message,
            (result) => this.handleGoogleResponse(result), //if response is successful handleGoogle gets triggered
            (error) => console.log(error) //error function if not result function
        );
    }
    onQuickReply(quickReply) { 
        this.setState(previousState => ({
            messages: GiftedChat.append(previousState.messages, quickReply),
        }))

        let message = quickReply[0].value;
        Dialogflow_V2.requestQuery( //sends request to Dialogflow, w 3 parameters
            message,
            (result) => this.handleGoogleResponse(result), //if response is successful handleGoogle gets triggered
            (error) => console.log(error) //error function if not result function
        );
    }

   
    
    sendBotResponse(text) {
        let msg = { //create the message object
          _id: this.state.messages.length + 1,
          text, //pass the message we receive to the user
          createdAt: new Date(), //when the message is generated
          user: MT_BOT //bot sends the response to the user
        };
    
        this.setState(previousState => ({   //updates state of the App component & displays text on app
          messages: GiftedChat.append(previousState.messages, [msg])
        }));
    }
    

    render() {
        return (
            <View style={{ flex: 1, backgroundColor: '#caf7e3' }}>
                <GiftedChat
                    messages={this.state.messages}
                    onSend={messages => this.onSend(messages)}
                    onQuickReply={(quickReply) => this.onQuickReply(quickReply)}
                    user={{
                        _id: 1
                    }}
                />
            </View>
        )
    }
}
4

0 回答 0