使用Chatgpt构建自定义聊天机器人-DEV365 开发者社区

chatgpt是有史以来最强大的语言模型。它是一个了不起的工具，可以通过各种方式使用来提高您的生产力和学习。 Chatgpt可以支持快速回答复杂概念的琐碎问题或深入解释。在短短几周内，Chatgpt已成为一种流行的AI工具。根据SamelyWeb的数据，它在去年1月击中了1亿个活跃用户。

。

根据Drift S 2021的对话营销报告，有74％的公司希望实施会话人工智能（AI）工具来简化工作流程。显然，它具有从客户服务到虚拟助手的广泛应用。 chatgpt是一个非常适合的例子，因为它可以生成对用户输入的类似人类的响应。

在本文中，我们将了解有关Chatgpt的更多信息，并使用Python和React Frameworks构建自定义聊天机器人。

入门

什么是chatgpt

Chatgpt是由Openai创建的，Openai是一家由Elon Musk和Sam Altman共同创立的研究公司。该公司于2022年11月30日启动了Chatgpt。这是最复杂的语言处理AI模型之一。

。

chatgpt可以用语言结构生成任何内容，其中包括回答问题，写论文和诗歌，翻译语言，总结长文本，甚至编写代码片段！

chatgpt使用艺术状态AI技术来理解和对广泛的问题和提示产生类似人类的回答。它结合了自然语言处理技术和机器学习算法来理解单词和句子背后的含义，并生成适合对话上下文的响应。它已经接受了大量文本数据的培训，包括文章，书籍和网站，使其能够提供精确而有见地的答案。

How to use ChatGPT

您可以通过访问chat.openai.com访问chatgpt，创建一个OpenAI帐户并同意ChatGpt条款。

创建一个OpenAI帐户

转到chat.openai.com并注册带有电子邮件地址的帐户。您需要在OpenAI网站上创建一个帐户才能登录和访问Chatgpt。

接受chatgpt条款

登录网站上的OpenAI帐户后，请仔细阅读CHATGPT的条款和条件，然后单击下一步。单击完成以完成它。

开始写作提示

chatgpt现在可以使用。您可以在页面底部的文本框中输入任何提示，然后按Enter提交。然后，AI聊天机器人将为您的提示提供有用的答案。

您可以在网站中提到的任何示例提示或您自己的提示以获取答案。用简单术语解释量子计算的结果如下，

python中的GPT3集成

Openai Python库从用Python语言编写的应用程序提供了方便地访问OpenAI API。

按照以下步骤集成python中的gpt3。

访问OpenAi的服务需要API令牌。
Open platform.openai.com.
单击位于页面右上角的您的名称或图标选项，然后选择“ API键”或单击链接âAccount API Keys — OpenAI API
单击创建新的秘密键按钮创建一个新的OpenAI键。
在安装OpenAI和其他库之前，请创建并切换到虚拟环境。

python -m venv venv
source venv/bin/activate  # for linux
venv\Scripts\activate     # for windows

使用PIP安装OpenAi Python库。

pip install openai

创建一个新的python文件chatgpt_demo.py，然后向其添加以下代码。

import openai
openai.api_key = "" # your token goes here

def get_model_reply(query, context=[]):
    # combines the new question with a previous context
    context += [query]

    # given the most recent context (4096 characters)
    # continue the text up to 2048 tokens ~ 8192 charaters
    completion = openai.Completion.create(
        engine='text-davinci-002',
        prompt='\n\n'.join(context)[:4096],
        max_tokens = 2048,
        temperature = 0.4, # Lower values make responses more deterministic
    )

    # append response to context
    response = completion.choices[0].text.strip('\n')
    context += [response]

    # list of (user, bot) responses. We will use this format later
    responses = [(u,b) for u,b in zip(context[::2], context[1::2])]

    return responses, context

query = 'Which is the largest country by area in the world?'
responses, context = get_model_reply(query, context=[])

print('<USER> ' + responses[-1][0])
print('<BOT> ' + responses[-1][1])

使用以下命令运行脚本，

python chatgpt_demo.py

openai.Completion.create()根据查询为您提供GPT3响应。在上面的示例中，我们要求它用单个术语解释什么量子计算。它能够对查询提出一个清晰的答案。

基于Gradio的前端创建

Gradio是用于构建AI相关的Web应用程序的开源Python库。它允许开发人员创建用户友好和可自定义的接口。

请按照以下步骤创建基于Gradio的前端以显示内容。

使用PIP安装Gradio Python库。

pip install gradio

将以下代码添加到chatgpt_demo.py文件中。

import gradio as gr

# defines a basic dialog interface using Gradio
with gr.Blocks() as dialog_app:
    chatbot = gr.Chatbot()
    state = gr.State([])

    with gr.Row():
        txt = gr.Textbox(
            show_label=False, 
            placeholder="Enter text and press enter"
        ).style(container=False)

    txt.submit(get_model_reply, [txt, state], [chatbot, state])

# launches the app in a new local port
dialog_app.launch()

使用以下命令运行应用程序，

python chatgpt_demo.py

Gradio将在执行dialog_app.launch()时打开一个新端口并启动交互式应用程序。运行上一节中提供的示例应返回相同的预期结果。用户输入的消息将出现在右侧，而OpenAI生成的消息将显示在左侧。

构建自定义聊天机器人

在本节中，我们将使用带有Python的GPT3作为后端创建自定义聊天机器人，并作为前端做出反应。

1.1创建数据文件

第一步是创建一个数据文件，其中包含有关特定主题的信息。在此示例中，我们使用与量子物理相关的内容。从链接中删除数据scienceexchange quantum-physics，并将其添加到数据文件夹下的名为data.txt的文本文件中。

确保您已将以下文本添加为data.txt文件中的前缀。

I am VBot, your personal assistant. I can answer questions based on general knowledge.

Answer questions based on the passage given below.
The final data file looks as below,

1.2创建环境

在安装OpenAI和其他库的依赖项之前，创建并切换到虚拟环境。

python -m venv venv
source venv/bin/activate  # for linux
venv\Scripts\activate     # for windows

1.3安装依赖项

使用pip安装openai，fastapi，uvicorn，uvicorn和python-dotenv库。

pip install openai fastapi uvicorn itsdangerous python-dotenv

1.4创建环境（.env）文件

创建一个名为.env的文件，并为其添加OpenAI API键和秘密键的环境变量。

export OPENAI_API_KEY="openai-key"
export SECRET_KEY="32-length-random-text"

1.5 OpenAI GPT3后端集成

创建一个新文件main.py并添加以下代码以集成您的查询响应的OpenAI GPT3模型。

import openai
import os
from dotenv import load_dotenv
import os 

load_dotenv(".env")
openai.api_key = os.getenv("OPENAI_API_KEY")

def read_file(file):
    content = ""
    f = open(file, 'r')
    Lines = f.readlines()
    for line in Lines:
        content = content + " " + line.strip()
    return content

session_prompt = read_file("datas/data.txt")
restart_sequence = "\n\nUser:"
start_sequence = "\nVBot:"

def answer(ques, chat_log = None):
    max_try = 1
    try_count = 0
    while True:
        try:
            prompt_text = f'{chat_log}{restart_sequence} {ques}{start_sequence}'
            print(prompt_text)
            response = openai.Completion.create(
                model = "text-davinci-002",
                prompt = prompt_text,
                temperature = 0.8,
                max_tokens = 500,
                top_p = 1,
                frequency_penalty = 0.0,
                presence_penalty = 0.6,
                stop = ["User:", "VBot:"]
            ) 
            # print(response)
            ans = response['choices'][0]['text']
            return str(ans)
        except:
            try_count = try_count + 1
            if(try_count >= max_try): 
                return 'GTP3 error'
            print('Error')

def checkViolation(ans):
    response = openai.Moderation.create(input=ans)
    output = response["results"][0]["flagged"]
    return output

def gpt3_logs(question, answer, chat_log=None):
    if chat_log is None:
        chat_log = session_prompt
    return f'{chat_log}{restart_sequence} {question}{start_sequence}{answer}'

def message_check(message, chat_log):
    flag_user = checkViolation(message)
    if(not flag_user):
        ans = answer(message,chat_log)
        flag_bot = checkViolation(ans)
        if(flag_bot):
            ans = "My response violates OpenAI's Content Policy."
    else:
        ans = "Your message violates OpenAI's Content Policy."
    return ans

def main(msg,chat):
    ans = message_check(msg,chat)
    print("VBot: ", str(ans))
    return ans

if __name__ == "__main__":
    ans = main("What is your name",chat=None)

了解代码：

加载环境变量并设置openai.api_key。
创建一个方法read_file(file)来读取文本文件中的内容。
使用read_file()方法初始化session_prompt变量，并使用数据文件内容。另外，将start_sequence和restart_sequence的初始化为“ \ nvbot：”和“ \ n \ nuser：”
创建一个方法answer(ques, chat_log)。它将问题和聊天日志作为参数，并借助openai.Completion.create()方法提供了OpenAI的回答。
message_check()和checkViolation()方法负责使用openai.Moderation.create()方法验证OpenAI请求和响应。
gpt3_logs方法指定了以预定义格式的OpenAI请求和响应。

1.6创建并集成了FastAPI服务器

创建一个API服务器，以通过HTTP请求提供GPT3集成。为此，选择FastApi来创建API。

创建一个名为app.py的文件，然后向其添加以下代码。

from fastapi import FastAPI, Request
from fastapi.middleware.cors import CORSMiddleware
from starlette.middleware.sessions import SessionMiddleware
import uvicorn
import os
from dotenv import load_dotenv
from main import gpt3_logs, main

app = FastAPI()

load_dotenv(".env")
secret_key_from_env = os.getenv("SECRET_KEY")

app.add_middleware(
    SessionMiddleware,
    secret_key = secret_key_from_env
)

app.add_middleware(
    CORSMiddleware,
    allow_origins = ["*"],
    allow_credentials = True,
    allow_methods = ["*"],
    allow_headers = ["*"],
)

@app.get("/")
def home():
    return "Hit from VBot"

@app.get("/api/response")
async def get_response(message: str, request: Request):
    chat_log = request.session.get('chat_log')
    if(chat_log == None):
        request.session['chat_log'] = gpt3_logs('', '', chat_log)
        chat_log = request.session.get('chat_log')
    response =  main(message,chat_log)
    if(len(response)!=0):
        request.session['chat_log'] = gpt3_logs(message, response, chat_log)
        return response
    else: 
        return "Oops! Something went wrong"

if __name__ == "__main__":
    uvicorn.run("app:app",port = 8000,reload=True)

了解代码：

导入fastapi库方法和中间。创建一个基本的fastapi对象应用程序为app = FastAPI()。
加载环境文件，并在FastAPI中间件中添加秘密键。用CORS配置中间件。
创建一个get路线â/â€，将发送响应，因为vbot>
创建一个get路由â/api/wonsess，它将接收用户的请求并将其发送到main()方法，并在响应不空时将响应发送给用户。
使用uvicorn.run(“app:app”,port = 8000,reload=True)运行uvicorn服务器。

1.7运行后端服务器

使用以下命令运行后端Python服务器。

python app.py

您可以在服务器启动并运行服务器后击中url http://127.0.0.1:8000。
您可以点击http://127.0.0.1:8000/api/response?message=”what is quantum physics”以查看GPT3响应。

2.1创建前端应用程序

使用Create-React-App Cli创建一个React应用程序。

npx create-react-app chatbot-frontend

2.2安装尾风CSS

安装tailwindcss并使用npm生成tailwind.config.js文件。

npm install -D tailwindcss
npx tailwindcss init

将以下代码添加到tailwind.config.js文件中。

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

将@tailwind指令添加到./src/index.css文件的顶部。

@tailwind base;
@tailwind components;
@tailwind utilities;

2.3安装依赖项

使用以下命令安装对应用程序的反应语音识别，Axios和React-Loader-Spinner软件包。

npm i react-speech-recognition axios react-loader-spinner

2.4创建机器人前端

将以下代码添加到App.js文件。

import './App.css';
import { useEffect, useState, useRef } from 'react'
import React from 'react'
import arrow from './assets/arrow.png'
import bg from './assets/bg.png'
import mic from './assets/mic.png'
import mic_on from './assets/mic_on.png'
import axios from 'axios';
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition'
import { Dna } from 'react-loader-spinner'

function App() {
  const [userInput, setUserInput] = useState('')
  const [recording, setRecording] = useState(false)
  const [loading, setLoading] = useState(false)
  const [messages, setMessages] = useState([
    {
      msg: "Hello, How can I help you ?",
      fromUser: false,
    }
  ])
  const bottomRef = useRef(null);

  const themes = {
    primaryColor: "#475569",
    secondryColor: "#475569",
    primaryFontColor: "white",
    secondryFontColor: "#2C3333",
    logoColor: "#E7F6F2",
    backgroudImage: bg
  }

  const commands = [
    {
      command: 'clear',
      callback: ({ resetTranscript }) => resetTranscript()
    },
    {
      command: 'reset',
      callback: ({ resetTranscript }) => resetTranscript()
    }
  ]

  const {
    transcript,
    resetTranscript,
    browserSupportsSpeechRecognition
  } = useSpeechRecognition({ commands });

  useEffect(() => {
    if (userInput !== '') {
      setLoading(true)
      axios.get(`http://localhost:8000/api/response?message=${userInput}`)
        .then((response) => {

          speechSynthesis.cancel();
          let utterance = new SpeechSynthesisUtterance(response.data);
          speechSynthesis.speak(utterance);

          setUserInput('')
          resetTranscript()
          setMessages([...messages, { msg: response.data, fromUser: false }])
          setLoading(false)
        }, (error) => {
          console.log(error);
        });
    }
  // eslint-disable-next-line
  }, [messages])

  useEffect(() => {
    setUserInput(transcript)
  }, [transcript]);

  const sendMessage = () => {
    if (userInput !== '') {
      setMessages([...messages, { msg: userInput, fromUser: true }]);
    }
  };

  if (!browserSupportsSpeechRecognition) {
    alert("Browser doesn't support speech recognition.")
  }

  const handleRecording = () => {
    if (recording) {
      SpeechRecognition.stopListening()
    }
    else {
      resetTranscript()
      setUserInput('')
      SpeechRecognition.startListening({ continuous: true })
    }
    setRecording(!recording)
  }

  return (
    <div className="min-h-screen bg-gray-100" style={{ background: `url(${themes.backgroudImage})`, backgroundSize: 'cover' }}>

      <div style={{ backgroundColor: themes.primaryColor }} className={`w-full h-18  fixed flex justify-between`}>
        <div style={{ color: themes.logoColor }} className='text-green-100 text-3xl font-bold p-5 font-sans'>VBot</div>
      </div>

      <div className='py-32'>
        <div className="max-w-2xl mx-auto space-y-12 grid grid-cols-1 overflow-y-auto scroll-smooth scrollbar-hide overflow-x-hidden" style={{ maxHeight: '30rem' }}>
          {loading && 
            <div className='flex justify-center items-center'>
              <Dna visible={true} height="100" width="100" ariaLabel="dna-loading" wrapperStyle={{}} wrapperClass="dna-wrapper" />
            </div>
          }
          <ul>
            {messages && messages.map((message, idx) => {
              return (
                <div key={idx} className={`mt-3 ${message.fromUser ? "place-self-end text-right" : "place-self-start text-left"}`}>
                  <div className="mt-3  p-3 rounded-2xl" 
                    style={{ backgroundColor: message.fromUser ? themes.primaryColor : 'white', 
                             color: message.fromUser ? themes.primaryFontColor : themes.secondryFontColor, 
                             borderTopLeftRadius: !message.fromUser && 0, borderTopRightRadius: message.fromUser && 0 }} >
                    <p className="break-words text-md">
                      {message.fromUser ? message.msg : message.msg}
                    </p>
                  </div>
                </div>
              )
            })}
          </ul>
          <div ref={bottomRef} />
        </div>
      </div>

      <div className={`w-full fixed bottom-0`}>
        <div className='justify-end items-center bg-white rounded-xl flex mx-96 my-3'>
          <input className='p-3 bg-white w-full rounded-l-md border-0 outline-none'
            placeholder="Ask your question..."
            type="text"
            id="message"
            name="message"
            value={userInput}
            onChange={(e) => setUserInput(e.target.value)}
          />
          <button className='bg-white px-4' disabled={!browserSupportsSpeechRecognition} onClick={handleRecording}>
            {recording ? <img className='w-10' src={mic_on} alt="mic"></img> : <img className='w-10' src={mic} alt="mic"></img>}
          </button>
          <button style={{ backgroundColor: themes.secondryColor }} className={`p-4 rounded-r-xl`} onClick={sendMessage}>
            <img className='w-8' src={arrow} alt="arrow" />
          </button>
        </div>
      </div>
    </div>
  )
}

export default App;

了解代码：

进口资产（BG，箭头，MIC，MIC_ON图标），Axios，语音识别和DNA（React Loader Spinner）软件包。
初始化状态，例如用户授权，记录，加载和消息。 UserInput用于保留用户输入，记录从麦克风收集用户输入，并将消息存储在bot中的请求 /响应。< / li>
使用用户输入的使用效果挂钩（第50号线69）调用后端API（http://localhost:8000/api/response?message=userInput），并在消息状态中存储来自bot的响应。
sendMessage（）如果用户输入不是空的，则将用户输入在消息状态内设置。此操作调用useeffect（）方法，其中依赖项数组中添加消息状态。
handlereCording（）方法处理用户语音输入并将其存储在用户input状态中。
从97到150的行将用户输入文本框，音频输入图标，发送按钮和消息气泡设置UI。
UI接受文本框中的用户输入作为控制台或通过语音识别模块的文本。在每个键按下的UserInput状态更新。当用户单击“发送”按钮时，它将调用sendmessage（）方法，如果用户ints不空，它将设置带有用户input值的消息状态。消息值更改将调用usefeft（）并向后端发送请求（http://localhost:8000）。后端的响应将更新为消息状态，并以fromuser属性为false。此值将显示在消息气泡上作为机器人响应。

2.5运行应用程序

按照步骤1.7运行后端服务器。
使用以下命令运行前端React应用程序。

npm start

您将获得下面的输出，

那里有！您自己的聊天机器人由GPT3驱动：）

chatgpt的应用

chatgpt是一种了不起的工具，可用于提高您的生产力和学习。让我们探索一些您可以使用此工具使生活更轻松，更有生产力的方式。

产生想法和头脑风暴

chatgpt可能有益于集思广益的想法，例如生日聚会庆祝的想法，食谱创意或整个餐饮计划。

了解复杂的主题

chatgpt可以用外行术语为您提供有关复杂主题的精确，清晰的概述。如果您想了解机器学习，或找出如何使用量子计算，ChatGpt是帮助您了解主题的理想选择。

获得编码和调试的帮助

chatgpt可以提供代码示例，或通过为常见编码或错误提供解决方案来帮助您进行故障排除。它也可以帮助您查找语法和参数。

在您自己的数据上训练Chatgpt

您可以将自己的数据馈送到模型中，并使用算法微调模型的参数。 CHATGPT将接受您的特定数据培训。最后，您可以导出模型并开发API，使您的系统可以与其他工具和平台进行交互。

作为写作助理

它是一首诗，新闻文章，电子邮件还是一篇文章，ChatGpt将提供可定制的内容，您可以在不同的情况下使用。

获取个性化建议

chatgpt可以担任您的购物助理，健康助理，为您提供适合您任务的定制建议。

总结最新研究

chatgpt可以总结研究作品，包括整个报告，网页或研究。它将提供您提示的内容的总结。

翻译文字

这是将文本转换为不同语言的强大工具。它支持95种不同的语言。

查找数据集

chatgpt对于寻找数据集很有用，它可以通过各种在线数据库，存储库和资源进行搜索，以为您找到相关的数据集。您可以将功能用于研究，商业智能或培训机器学习模型。

情感分析

chatgpt可以分析文本中使用的单词，短语和标点符号，并确定诸如正面，负面或中性的音调。

感谢您阅读本文。

感谢Gowri M Bhatt查看内容。

感谢Fabius S Thottappilly和Grigary C Antony使用Chatgpt创建自定义聊天机器人的支持。

如果您喜欢这篇文章，请单击“心脏”按钮 - 分享以帮助其他人找到它！

本文也可以在Medium上找到。

如果您有兴趣使用RASA开发聊天机器人，请查看以下文章，

Create your chatbot using Rasa and deploy it on AWS | medium.com

可以在此处找到本教程的完整源代码，

GitHub - codemaker2015/VBot-custom-gpt3-chatbot: Custom GPT3 powered chatbot using python and react | github.com

有用的链接：

入门

目录