赞
踩
近日,OpenAI公司的ChatGPT模型走红网络。同时,OpenAI也推出了Chat API和gpt-3.5-turbo模型,让开发者能够更轻松地使用与ChatGPT类似的自然语言处理模型。
通过OpenAI API,我们可以使用gpt-3.5-turbo模型,实现多种任务,包括:撰写电子邮件或其他文本内容,编写Python代码,创建对话代理,回答各类问题,为软件提供自然语言界面,进行各学科的辅导,翻译语言,为视频游戏模拟角色等,还有许多未被挖掘的应用场景。
本文将为大家介绍如何使用OpenAI的Python SDK实现自己的聊天机器人。如果你已经使用过OpenAI的Python SDK,请确保将其升级到最新版本(0.27.0)。如果你还没有安装Python运行环境,请先安装Python 3.10。
接下来,我们将用FastAPI快速创建一个API,它的接口定义如下:
- POST /chatbot/talk
-
- Request Body:
- {
- “message”: "你好!"
- }
-
- Response:
- {
- “content”: “机器人回复消息”
- }
首先,你需要在命令行中安装FastAPI和OpenAI SDK,运行以下命令:
pip install fastapi uvicorn openai
为了方便演示,下面是一个最基本的FastAPI服务实现,文件保存在main/app.py文件中。
- import openai
- from typing import List
- from fastapi import FastAPI
- from pydantic import BaseModel
- from starlette.middleware.cors import CORSMiddleware
-
- history = []
- app = FastAPI()
-
- app.add_middleware(
- CORSMiddleware,
- allow_origins=["*"],
- allow_credentials=True,
- allow_methods=["HEAD", "OPTIONS", "GET", "PUT", "PATCH", "POST", "DELETE"],
- allow_headers=["*"],
- max_age=86400
- )
-
- openai.api_key = "输入您的Key"
-
- class TalkRequest(BaseModel):
- message: str
-
- @app.post("/chatbot/talk")
- async def chatbot_talk(user_input: TalkRequest):
- if not history:
- history.append({"role": "system", "content": "你好,我是你的私人助手!"})
- history.append({"role": "user", "content": user_input.message.strip() })
-
- response = await openai.ChatCompletion.acreate(
- model="gpt-3.5-turbo",
- messages=history)
- bot_response = response.choices[0].message
- history.append({"role": "bot", "content": bot_response})
- return {"content": bot_response}
现在只需创建一个 run.py文件来启动 FastAPI 服务。
- import uvicorn
-
- from main.app import app
-
- if __name__ == '__main__':
- uvicorn.run(
- app=app,
- host="127.0.0.1",
- port=8080,
- use_colors=True,
- log_level="debug"
- )
接下来运行 run.py。
在浏览器中打开 http://127.0.0.1:8080/docs 即可看到 Swagger 界面已经加载并显示出我们的 Talk API,如下图所示:
点击 Try it out, 在 message 里填入一个句子,例如我们这里输入的”你好”,点击 Execute按钮。如果没有问题应该能得到下面的响应结果:
OK,到这里我们的后台服务就已经准备好了。
这是一个用于搭建聊天机器人 UI 界面的代码示例,其中使用了 Vue.js 和 Axios。用户可以在浏览器中打开一个页面,输入文本消息并发送到聊天机器人 API,然后接收聊天机器人的响应。
首先,需要在 Vue 项目中创建一个名为 Chat.vue 的组件。在 Chat.vue 中,可以添加一个文本框和一个发送按钮,用于向聊天机器人发送消息。然后,使用 Vue.js 的数据绑定功能,将文本框的值绑定到一个名为 message 的 Vue 组件数据属性。在发送按钮上添加一个点击事件,该事件将调用一个 sendMessage 方法,该方法将使用 Axios(或其他 HTTP 库)将消息 POST 到聊天机器人 API。在发送成功后,使用 Axios 响应中的数据更新 Vue 组件数据属性的值,以显示聊天机器人的响应消息。
这里提供了一个基本的 Chat.vue 文件代码示例:
- <template>
- <div>
- <div v-for="(message, index) in messages" :key="index">
- <div v-if="message.isBot">{{ message.content }}</div>
- <div v-else>{{ message.content }}</div>
- </div>
- <input v-model="message" type="text" placeholder="Type your message here...">
- <button @click="sendMessage">Send</button>
- </div>
- </template>
-
- <script>
- import axios from 'axios'
-
- export default {
- name: "ChatView",
- data() {
- return {
- message: '',
- messages: [],
- }
- },
- methods: {
- async sendMessage() {
- const url = 'http://127.0.0.1:8080/chatbot/talk'
- const data = { message: this.message }
- const response = await axios.post(url, data)
- this.messages.push({ content: this.message, isBot: false })
- this.messages.push({ content: response.data.content, isBot: true })
- this.message = ''
- },
- },
- }
- </script>
在这个示例中,messages 是一个数组,它用于存储聊天记录。sendMessage 方法将新消息添加到 messages 数组中,并使用 Axios 发送消息并更新响应的数据属性。最后,它清空了 message 数据属性,以便用户可以输入下一个消息。在模板中,我们使用 v-for 循环遍历 messages 数组,并根据 isBot 数据属性来判断消息是用户的消息还是聊天机器人的消息。
需要注意的是,这个示例中聊天机器人 API 的地址是 http://127.0.0.1:8080/chatbot/talk。如果聊天机器人 API 的地址不同,需要相应地修改 sendMessage 方法中的 url 变量。
最后,要在浏览器中运行 Vue 应用程序,需要执行以下步骤。
确保已经安装了 Node.js 和 npm,这将使我们能够使用 Vue 的命令行工具来创建和管理项目。
打开命令行终端,导航到项目目录,并使用以下命令安装 Vue CLI:
npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm install -g @vue/cli
使用以下命令创建一个新的 Vue 项目:
vue create my-chat-app
根据需求进行选择,稍等片刻项目即可创建成功。
进入 my-chat-app 目录,安装 Axios:
cnpm install axios --save
将 Chat.vue 组件添加到 src/components 文件夹中。
打开 src/App.vue 文件,并将以下代码添加到模板中:
- <template>
- <div>
- <Chat />
- </div>
- </template>
- <script>
- import Chat from './components/Chat.vue'
-
- export default {
- name: 'App',
- components: {
- Chat,
- },
- }
- </script>
在命令行终端中运行以下命令启动开发服务器:
npm run serve
打开 http://localhost:8081/,可以看到一个基本的聊天窗口可以体验聊天机器人。
因文章篇幅有限,感兴趣的同行完全可以利用前端技术做出更精美的机器人聊天窗口。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。