Openai实时API：指南示例

>新引入的OpenAI实时API使我们能够将快速，低延迟，多模式体验集成到我们的应用程序中。使用此API，我们可以在用户和大型语言模型（LLMS）之间创建无缝的语音到语音交互。

>

>此API消除了多个模型以实现语音驱动体验的需求，因为它在一个集成的API中提供了完整的解决方案。它不仅旨在减少潜伏期，而且还保留了对话的情感细微差别和自然流动。 在本文中，我们将学习如何使用OpenAI实时API来构建语音控制的AI助手。我们将使用node.js创建持久的Websocket连接，以及如何在终端中使用它来与API通信。此外，我将指导您部署使用此API功能的React应用程序。

使用WebSockets使用实时API

与OpenAI API的其他组件不同，实时API使用Websockets。 WebSockets是一种通信协议，可以在客户端和服务器之间建立双向通信渠道。与HTTP使用的常规请求响应模型相反，Websockets支持正在进行的实时交互。这使Websocket特别适合实时应用程序，例如语音聊天。

>本文将介绍Webockets的工作方式，并包括与实时API进行交互的几个示例。 

>我们将使用node.js，因此我们需要确保将其安装在计算机上。如果没有，我们可以从其官方网站下载和安装node.js。

>初始化脚本

>跟随，我们建议使用上面创建的.env文件创建一个文件夹。在该文件夹中，运行以下命令以初始化脚本：

>完成此命令后，这些文件应在文件夹中：>

npm init -y && touch index.js

安装依赖项

从安装两个软件包开始：

ws：这是Websocket软件包，与API交互所需的主要软件包。

> dotenv：一个从.env文件加载API键的实用程序软件包。

通过运行命令安装这些：

连接到实时API
>要启动与实时API的连接，我们创建了一个新的WebSocket对象，传递API URL和标头，并带有所需的信息以连接到它：>

打开连接时设置操作

上面的代码创建了与API的Web套接字连接，但尚未对其进行任何作用。

npm install ws dotenv

>

Websockets允许我们在某些事件发生时设置操作。我们可以使用开放事件来指定一些我们要执行连接后要执行的代码。

添加事件侦听器的通用语法如下：

>

npm init -y && touch index.js

替换＆lt; event＆gt;带有包含事件名称的字符串和＆lt; function＆gt;发生事件发生时要执行的函数。 

这是一旦连接准备就可以显示文本的方法：

>

npm install ws dotenv

要运行此代码，我们使用命令：>

// Import the web socket library
const WebSocket = require("ws");
// Load the .env file into memory so the code has access to the key
const dotenv = require("dotenv");
dotenv.config();
function main() {
  // Connect to the API
  const url = "wss://api.openai.com/v1/realtime?model=gpt-4o-realtime-preview-2024-10-01";
  const ws = new WebSocket(url, {
      headers: {
          "Authorization": "Bearer " + process.env.OPENAI_API_KEY,
          "OpenAI-Beta": "realtime=v1",
      },
  });
}
main();

如果正确设置了API键，我们将在终端中看到“连接是打开”消息。脚本将继续运行，因为连接仍然开放，因此我们必须手动停止它。

接收到消息时设置操作

>在使用WebSockets时我们可以响应的另一个事件是消息事件。每次从服务器接收消息时，都会触发这一点。让我们添加一个显示每个收到消息的函数：

>

现在运行脚本也应显示会话。在初始化会话时API发送的创建事件。

ws.on(<event>, <function>);</function></event>

其他WebSocket事件

>上面，我们学会了如何将事件听众添加到“开放”和“消息”事件中。 WebSocket支持我们在示例中不会使用的两个其他事件。

>

关闭套接字时，可以使用关闭事件来添加回调：

发生错误时，错误事件用于添加回调：

>

// Add inside the main() function of index.js after creating ws
async function handleOpen() {
  console.log("Connection is opened");
}
ws.on("open", handleOpen);

与实时API

进行通信

>使用Websockets需要我们以事件驱动的方式进行编程。消息是在通信渠道上来回发送的，我们无法控制何时传递或接收这些消息。 

node index.js

启动通信的代码应在handingopen（）中添加。 o否则，将发生错误，因为该代码可以在创建Web套接字通信频道之前执行。

>对于代码处理消息也是如此。所有逻辑都应进入handlemessage（）函数。

> 在即将到来的示例中，我们将使用以下代码作为起点。大多数更改涉及更新handingopen（）和handlemessage（）。

>

使用实时API发送和接收文本

通过使用事件，与实时API进行通信。 OpenAI实时文档API列出了其支持的事件。我们使用对话。事件表示为JSON对象，其字段在文档中描述。

这是对话的示例。

这个事件告诉API我们要启动文本对话。这是在内容字段中使用的“ input_text”类型在内容字段中指定的。

>我们使用ws.send（）方法发送消息。 Web套接字包期望字符串作为参数，因此我们需要使用JSON.STRINGIFY（）函数将JSON事件转换为字符串。将这些放在一起，这是我们可以发送上述事件的方式：

npm init -y && touch index.js

>这将启动对话，但不会触发API自动向我们发送响应。为了触发响应，我们发送响应。创建事件。这是一个示例：

npm install ws dotenv

此事件使用模式响应参数请求文本响应。说明是最重要的部分，描述了我们希望该模型要做的事情，在这种情况下，要求为用户提供帮助。

>我们将这两个事件发送到handleopen（）函数中，以便在建立连接后立即启动对话。这是此示例中的全部实现：

>

// Import the web socket library
const WebSocket = require("ws");
// Load the .env file into memory so the code has access to the key
const dotenv = require("dotenv");
dotenv.config();
function main() {
  // Connect to the API
  const url = "wss://api.openai.com/v1/realtime?model=gpt-4o-realtime-preview-2024-10-01";
  const ws = new WebSocket(url, {
      headers: {
          "Authorization": "Bearer " + process.env.OPENAI_API_KEY,
          "OpenAI-Beta": "realtime=v1",
      },
  });
}
main();

关于传入消息，有三种类型的事件值得注意：响应.text.delta，Response.text.done和wendesp.done。

>响应.text.delta事件包含响应分解为三角洲字段中的块。当我们想提供实时体验时，它们很重要，因为它们允许我们立即通过块串出响应块。 

• 响应.text.done事件标记了文本响应的终点，并包含文本字段中的完整答案。>
响应。事件标记了响应的终点。>
我们可以使用handlemessage（）函数中的switch语句来指定我们的脚本如何对这些事件进行响应：

在此示例中，我们使用响应.text.delta事件在接收到该控制台的响应中打印出响应的块。响应完成后，触发了响应.text.done事件，我们打印一条新的行以显示输出已完成。最后，当我们收到响应事件时，我们关闭Web套接字。

>

要运行此示例，我们将这些函数粘贴到上面的模板代码中，并使用命令运行：

ws.on(<event>, <function>);</function></event>

>这将在终端中生成一个响应，以提示“在一个句子中解释Web套接字是什么”，类似于我们使用ChatGpt时。 

// Add inside the main() function of index.js after creating ws
async function handleOpen() {
  console.log("Connection is opened");
}
ws.on("open", handleOpen);

可以在此处获得文本示例的完整代码。

使用实时API发送和接收音频

>上一个示例显示了我们如何处理文本数据。但是，对实时API的真正兴趣是创建一个实时回复的语音助手。> 处理音频数据比处理文本数据要复杂得多。我们将跳过一些针对音频工作方式的细节，因为它们会分散我们从本文的主要主题中注意到我们的注意力。

首先，我们安装了两个软件包：>

npm init -y && touch index.js

> 扬声器用于播放AI语音响应。
• >

>我们还需要安装Sox（Sound Exchange），这是一种用于音频处理的命令行实用程序，该节点库将使用该实用程序与麦克风连接并记录音频。使用Brew Install Sox将其安装在MacOS或Sudo Apt inst sox上的Linux上。

>安装了这些软件包，我们将它们导入并添加一个函数Startrecording（），以记录用户的音频提示。我们不会详细解释该功能，因为它会使我们从主要主题中脱颖而出。 

加载环境后，将以下代码添加到index.js文件：

> StarTrecording（）函数从麦克风记录音频，并等待按下“ Enter”。 

接下来，我们通过初始化用于播放AI响应的speaker（）来更新main（）函数：

npm install ws dotenv

>

>以此为止，我们可以实现handingopen（）和handlemessage（）来处理音频。

>在handingopen（）函数中，我们只需要调用StarTrecording（）函数即可记录用户的音频提示。我们还需要稍微更新事件：

// Import the web socket library
const WebSocket = require("ws");
// Load the .env file into memory so the code has access to the key
const dotenv = require("dotenv");
dotenv.config();
function main() {
  // Connect to the API
  const url = "wss://api.openai.com/v1/realtime?model=gpt-4o-realtime-preview-2024-10-01";
  const ws = new WebSocket(url, {
      headers: {
          "Authorization": "Bearer " + process.env.OPENAI_API_KEY,
          "OpenAI-Beta": "realtime=v1",
      },
  });
}
main();

>更新createConversationEvent的内容以使用“ input_audio”而不是“ input_text”，然后用音频替换文本字段：base64audiodata。

>将“音频”添加到createresponseevent中的响应方式中。

>

这是更新的handleopen（）函数：
2. >要实现handlemessage（）函数，我们修改“ response.audio.delta”事件以更新音频缓冲区并播放新的声音delta：

>我们从Switch语句中删除“ Response.Text.done”事件，然后更新“响应。DONE”事件，以阻止扬声器：

ws.on(<event>, <function>);</function></event>

handlemessage（）函数的最终实现如下：

>

// Add inside the main() function of index.js after creating ws
async function handleOpen() {
  console.log("Connection is opened");
}
ws.on("open", handleOpen);

要运行此示例，将这些修改应用于模板代码，并使用命令运行：>

麦克风将开始录制。我们可以说我们的请求，然后按“ Enter”发送。然后，AI的响应将在扬声器上发挥作用（确保麦克风没有静音并且扬声器的音量）。

node index.js

可在此处提供音频示例的完整代码。

>

>函数调用

// Add inside the main() function of index.js
 async function handleMessage(messageStr) {
    const message = JSON.parse(messageStr);
    console.log(message);
}
ws.on("message", handleMessage);

OpenAI API的一个不错的功能是执行功能调用的功能。我们可以向助手添加功能，如果它检测到其中一个功能对于提供答案很有用，它将发送一个事件，要求调用特定功能。

openai文档提供了以下图，以说明函数呼叫的生命周期：

来源：OpenAi

从图中，我们看到客户端必须提供LLM可以调用功能的定义。此外，函数执行将在客户端端进行； AI将发送一个事件，要求调用该函数及其参数。然后，我们有责任寄回结果。

>

>让我们通过将两个数字添加在一起的函数授权我们的助手。我们将通过扩展上面的音频示例来构建此示例。

>

>要指定可用功能，我们必须为LLM提供工具列表。每个工具都是JSON对象，该对象指定有关该功能的信息。这是我们可以为总和函数定义工具的方法：>

npm init -y && touch index.js

让我们解释一下对象结构：

类型指定我们正在定义函数。
• >
>该名称用于识别该功能。这是LLM用来告诉我们要调用哪个功能的方法。
• >
该描述用于识别llm何时应使用此功能。>
• 参数用于指定函数的参数。在这种情况下，两个数字命名为a和b。
下一步是在我们的代码中定义函数。我们将使用键Counculate_sum使用字典，以使我们在响应函数呼叫事件时更容易调用适当的函数：

>

> API将提供函数参数为词典，其在上面的参数上定义了相同的结构。在这种情况下，要添加3和5，字典将为{“ a”：3，“ b”：5}。

npm install ws dotenv

> sumtool和函数常数可以添加到index.js的顶部，在导入之后和main（）函数之前。

接下来，我们更新响应。这是通过将工具和tool_choice字段添加到响应中来完成的：

LLM决定要调用函数时，它将发出响应。function_call_arguments.done事件。我们需要通过以下方式回复它

获取功能信息并调用函数。

// Import the web socket library
const WebSocket = require("ws");
// Load the .env file into memory so the code has access to the key
const dotenv = require("dotenv");
dotenv.config();
function main() {
  // Connect to the API
  const url = "wss://api.openai.com/v1/realtime?model=gpt-4o-realtime-preview-2024-10-01";
  const ws = new WebSocket(url, {
      headers: {
          "Authorization": "Bearer " + process.env.OPENAI_API_KEY,
          "OpenAI-Beta": "realtime=v1",
      },
  });
}
main();

发送函数调用的结果。

请求响应。
2. 我们通过将以下情况添加到Handemessage（）函数中的Switch语句：>来处理此操作。
3. 如果我们现在运行脚本并请求添加两个数字的结果，则该模型应调用该功​​能并提供结果。
>此功能相对简单，但是由于该函数是由客户端执行的，因此可能是任何东西。在下一部分中，我们将看到两个更复杂功能的示例。

>

此示例的完整代码可在此处找到。

>

>今天建立MLOPS技能

从头开始并获得职业生涯的MLOPS技能。使用OpenAI实时API

> OpenAI团队提供了一个演示React应用程序来展示实时API。在这里，我们将学习如何进行设置并探索其工作原理。这是构建一个更复杂应用程序的绝佳起点。

>

>应用程序设置

不需要React知识才能使其启动并运行。但是，您需要熟悉反应以修改或扩展它。

>

他们的应用在此存储库中托管。要设置它，请使用以下git命令克隆开始：

>

另外，我们也可以从GitHub接口手动下载它。

npm init -y && touch index.js

>

要安装该应用程序，我们使用以下NPM（节点软件包管理）命令：>

安装完成后，在项目的根文件夹中创建一个名为.env的文件，然后粘贴以下内容：

npm install ws dotenv

替换＆lt; openai_api_key＆gt;使用OpenAI API键。

// Import the web socket library
const WebSocket = require("ws");
// Load the .env file into memory so the code has access to the key
const dotenv = require("dotenv");
dotenv.config();
function main() {
  // Connect to the API
  const url = "wss://api.openai.com/v1/realtime?model=gpt-4o-realtime-preview-2024-10-01";
  const ws = new WebSocket(url, {
      headers: {
          "Authorization": "Bearer " + process.env.OPENAI_API_KEY,
          "OpenAI-Beta": "realtime=v1",
      },
  });
}
main();

现在应该准备执行该应用程序。它由两个部分组成：

一个由应用程序的Web用户界面组成的React前端。>

>继电器服务器用作前端和OpenAI API之间的中介。 

>在前端和OpenAI API之间实现继电器服务器的主要目的是安全地存储API键。没有此键，与API互动是不可能的。 但是，如果键存储在前端，则任何用户都可以访问它。因此，该解决方案涉及建立一个安全存储密钥并促进API和前端之间的数据交换的服务器。在这种特定情况下，安全问题是最小的，因为该应用程序仅在本地运行。 

>要启动应用程序，有必要同时启动继电器服务器和前端。要启动继电器服务器，请使用以下命令：>

启动React前端使用命令：>

完成加载后，将在浏览器上打开一个选项卡，并在其上运行该应用程序。

ws.on(<event>, <function>);</function></event>

使用该应用

开始使用该应用之前，请确保计算机不在静音上并允许麦克风访问该应用程序。

// Add inside the main() function of index.js after creating ws
async function handleOpen() {
  console.log("Connection is opened");
}
ws.on("open", handleOpen);

>

我们首先单击“连接”按钮。这将向实时API发送“ Hello”消息，我们将收到一个问候。

建立连接后，中心将出现一个新按钮，使我们可以与AI助手交谈。 

>使用它，按和交谈而无需释放按钮。释放按钮时发送消息。

>

该应用程序还具有VAD（语音活动检测）模式，在该模式中，我们不需要按任何按钮。在此模式下，应用程序将不断收听，使我们能够与助手进行积极的对话。要使用它，只需按“ VAD”按钮并说话。

函数

正如我们了解到的那样，实时API提供了一项功能，使AI能够执行特定的功能。该演示展示了两个功能：一个用于查询特定位置的天气预报，另一个用于添加记忆项目以个性化助手。 

>通过提出诸如“纽约明天的天气如何？”之类的问题来体验这些功能。并说明“我最喜欢的颜色是蓝色”之类的偏好。助手将对这些查询提供口头回应，信息也将显示在应用程序的右侧。

>有时我请求天气报告，而响应表明当时无法访问它。但是，这些信息始终显示在右侧。作为演示应用程序，它并不是要成为功能齐全的产品，而是用于展示API的功能。

了解客户端

本节需要对REACT的高级了解才能遵循，因为我们介绍了应用程序的一些实现详细信息。

我们将查看consolePage.tsx文件。这是定义大多数应用程序逻辑的地方。演示应用程序不像我们在node.js命令行应用程序示例中那样使用RAW WebSocket。他们建立了一个帮助与API互动的实时客户端。这就是文件顶部导入的内容：

>

在此useFect（）调用中定义了与API的集成。最初呈现控制台页面时，执行此useFect（）中的代码。与我们的node.js脚本类似，它概述了如何响应API事件。主要的区别是其使用RealtimeClient客户端包装器。>

定义工具

npm init -y && touch index.js

工具定义JSON对象。

要执行的函数。

• 此方法简化了工具的集成，因为客户端已经配备了处理事件和自动化功能调用。这里定义了内存工具，而天气工具的定义是在此处定义的。例如，要添加先前定义的总和工具，我们可以执行以下操作：>
  请注意，该应用程序使用Typescript，因此需要在功能定义中的类型规范。

  npm init -y && touch index.js

  聆听事件
  要收听事件，使用realtimeclient.on（）函数。它接受两个参数：

  事件的名称。

  要执行的回调函数。
  2. 此方法类似于先前使用的WebSocket.on（）函数，除非它实现了不同的事件集。他们的github页面提供了支持事件的列表。
  在此特定示例中，使用以下事件：

  实时事件，这里用于保留所有事件的日志。

  此处的错误事件只需将错误记录到控制台以进行调试目的。
  对话。中断的事件在此中断转换时取消请求。
  >最后，当新的Chuck从API进入时，此处的对话。
  结论
  • 在本教程中，我们探索了OpenAI实时API及其如何使用Websocket进行实时通信。我们介绍了Node.js环境的设置，以与API进行交互，发送和接收文本和音频消息，并实现函数，要求提高功能。
  >我们还探索了OpenAI Demo React应用程序，演示了如何部署基本语音助手应用程序。
  >要了解有关最新的OpenAI开发工具的更多信息，我建议这些教程：>

  OpenAI型号蒸馏：带有示例的指南

  gpt-4o视觉微调：带有示例的指南

  >

以上是Openai实时API：指南示例的详细内容。更多信息请关注PHP中文网其他相关文章！