OpenAI 推出用于下一代对话式 AI 开发的 ChatGPT 和 Whisper API_whisperjs api

作者：小舞很执着 | 2024-07-17 01:56:26

踩

whisperjs api

人工智能已经成为技术行业的推动力，使机器能够学习和执行以前被认为是人类独有的任务。领先的 AI 研究机构 OpenAI 一直走在这场革命的最前沿，开发可以处理自然语言并生成类似人类文本的强大模型。其中一个模型是 ChatGPT API，它可以对文本输入生成连贯且上下文相关的响应。

对于使用 Next.js（一种用于构建 Web 应用程序的流行 React 框架）的开发人员来说，集成 ChatGPT API 可以为对话式 AI 开启新的可能性。我的电脑在做什么提供了所有正在运行的程序的详细信息在本指南中，我们将探索 ChatGPT API 的强大功能，并向您展示如何将其与 Next.js 结合使用来构建更智能、更具吸引力的聊天机器人。无论您是经验丰富的开发人员还是刚刚开始使用 Next.js，本指南都将为您提供将对话式 AI 提升到新水平所需的知识和工具。因此，让我们开始并通过从头到尾集成 ChatGPT API 构建一个完整的 Web 应用程序来释放 ChatGPT API 的全部潜力。

检索 OpenAI API 密钥

为了能够在我们的 Next.js 应用程序中使用 OpenAI 的 API，我们需要先从 OpenAI 仪表板检索 API 密钥。

要检索您的 OpenAI API 密钥，您需要在 https://openai.com/ 创建一个用户帐户并访问 OpenAI 仪表板中的 API 密钥部分以创建一个新的 API 密钥。

此密钥是秘密的，不得与任何其他人共享。稍后在实现 Python 脚本以访问 OpenAI 的 API 时，我们将需要使用此密钥。

设置 Next.js 13 项目

接下来，我们需要创建一个新的 Next.js 13 项目来开始实施。使用以下命令：

$ npx create-next-app@latest --experimental-app

experimental -app标志指定我们要在 Next.js 项目中使用新的应用程序文件夹结构。

为了完成项目的创建过程，您需要在命令行中回答几个问题：

最后，您可以输入以下命令进入新创建的项目文件夹：

$ cd next13_chatgpt_api

由于我们想将 Chakra UI 用于 Web 应用程序的用户界面，因此我们需要安装更多依赖项：

$ npm i @chakra-ui/react @emotion/react @emotion/styled framer-motion @chakra-ui/next-js

成功安装 Chakra UI 依赖项后，我们需要通过打开文件 app/layout.js 激活 Chakra UI 在我们的应用程序中的使用，并将应用程序的页面嵌入到 CacheProvider 和 ChakraProvider 组件中，如下面的清单所示：


'use client'
 
import { CacheProvider } from "@chakra-ui/next-js";
import { ChakraProvider } from "@chakra-ui/react";
 
export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <head />
      <body>
        <CacheProvider>
          <ChakraProvider>{children}</ChakraProvider>
        </CacheProvider>
      </body>
    </html>
  );
}

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小舞很执着/article/detail/837371