Expo 中用于 React Native 的 Dialogflow API 聊天机器人

Question

我正在作为初学者学习 React Native。 我想在 Expo 的 React Native 中使用 Dialogflow 创建一个聊天机器人。

我搜索了所有论坛并用谷歌搜索，但没有找到任何专门针对 Expo 使用 Dialogflow 的参考，尽管找到了对 React Native CLI 的参考。

在这种情况下，任何人都可以指导我如何在 Expo React Native 中使用 Dialogflow 创建聊天机器人

Answer 1

在这里你将有一个很棒的教程！

https://blog.jscrambler.com/build-a-chatbot-with-dialogflow-and-react-native/

如果这对您有帮助，请检查它是否为正确答案...

下面是一些代码：

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { GiftedChat } from 'react-native-gifted-chat';
import { Dialogflow_V2 } from 'react-native-dialogflow';

import { dialogflowConfig } from './env';

const BOT_USER = {
  _id: 2,
  name: 'FAQ Bot',
 avatar: 'https://i.imgur.com/7k12EPD.png'
};

class App extends Component {
 state = {
   messages: [
    {
    _id: 1,
    text: `Hi! I am the FAQ bot 🤖 from Jscrambler.\n\nHow may I help you with today? 
    `,
     createdAt: new Date(),
    user: BOT_USER
   }
  ] 
};

componentDidMount() {
 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];
 this.sendBotResponse(text);
}

onSend(messages = []) {
  this.setState(previousState => ({
  messages: GiftedChat.append(previousState.messages, messages)
}));

let message = messages[0].text;
Dialogflow_V2.requestQuery(
  message,
  result => this.handleGoogleResponse(result),
  error => console.log(error)
 );
}

sendBotResponse(text) {
  let msg = {
  _id: this.state.messages.length + 1,
  text,
  createdAt: new Date(),
  user: BOT_USER
};

 this.setState(previousState => ({
   messages: GiftedChat.append(previousState.messages, [msg])
  }));
 } 

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

 export default App;

Answer 2

据我所知，Expo 不支持开箱即用的本机模块，这意味着需要链接本机代码的库（如

react-native-dialogflow

）可能无法直接在 Expo 中工作。

以下是解决此问题的方法：

1. 使用 Expo 的托管工作流程：坚持使用不需要本机代码的库。不幸的是，这限制了您的选择，但您仍然可以使用基于 Web 的集成，直接从 React Native 代码调用 Dialogflow 的 REST API。这可以使用

   fetch

   或 Axios 将用户输入发送到 Dialogflow 并处理应用程序中的响应来完成。

2. 从 Expo 弹出：如果您需要本机功能，请考虑从 Expo 弹出到裸工作流程。这将允许您使用像

   react-native-dialogflow

   这样需要本机链接的库。

3. REST API 方法：您可以手动处理对 Dialogflow API 的请求。这涉及向 API 发送用户消息、接收响应并将其显示在聊天机器人界面中。

对于无需处理后端集成的更简单的解决方案，请考虑使用Sista AI。它提供了一个具有语音功能的即用型聊天机器人，可以轻松集成到您的应用程序中，而无需处理本机链接或 API 管理的复杂性。