当前位置: 首页 > news >正文

OpenAI API key not working in my React App

题意:OpenAI API 密钥在我的 React 应用中不起作用

问题背景:

I am trying to create a chatbot in my react app, and I'm not able to generate an LLM powered response. I've been studying documentation and checking out tutorials but am unable to fix.

我正在尝试在我的 React 应用中创建一个聊天机器人,但无法生成由 LLM 驱动的响应。我一直在研究文档并查看教程,但无法解决问题。

I tried setting up a function for my chatbot, calling the api key, importing openai, setting up the parameters for the gpt-3.5-turbo model including temperature. The catch (error) section has a setResponse of 'Error generating response' and that's all I get after user inputs a question.

我尝试为我的聊天机器人设置一个函数,调用 API 密钥,导入 OpenAI,设置 gpt-3.5-turbo 模型的参数,包括温度。catch(错误)部分设置了 'Error generating response' 作为响应,用户输入问题后,我得到的只有这一条错误信息。

try {const response = await openai.createCompletion({model: 'gpt-3.5-turbo',prompt: question,max_tokens: 100,n: 1,stop: '\n',temperature: 1.17,headers: {Authorization: `Bearer ${API_KEY}`,}
});

问题解决:

First of all, as @KenWhite suggested, fix the fundamentals. Use the try...catch statement properly as follows:

首先,正如 @KenWhite 建议的那样,先修正基本问题。正确使用 try...catch 语句,如下所示:

try {// Your code here
} catch (error) {console.error(error);
}

Problem

Note: OpenAI NodeJS SDK v4 was released on August 16, 2023, and is a complete rewrite of the SDK. See the v3 to v4 migration guide.

注意:OpenAI NodeJS SDK v4 于 2023 年 8 月 16 日发布,并且是 SDK 的一次完全重写。请参阅 v3 到 v4 的迁移指南。

There are a few problems with the code you posted in your question. The solutions to these problems I provide below differ depending on whether you use OpenAI NodeJS SDK v3 or v4.

你问题中发布的代码有一些问题。我提供的解决方案根据你使用的是 OpenAI NodeJS SDK v3 还是 v4 而有所不同。

To check your OpenAI NodeJS SDK version, run the following command:

要检查你的 OpenAI NodeJS SDK 版本,请运行以下命令:

npm info openai version

Problem 1: Passing an invalid parameter to the API endpoint

问题 1:向 API 端点传递了无效的参数

You're trying to pass headers as a parameter to the API endpoint, which is not a valid parameter. Remove it.

你正试图将 headers 作为参数传递给 API 端点,但这不是一个有效的参数。请将其删除。

Solution

You need to set the Bearer token as follows...        你需要按照以下方式设置 Bearer 令牌..

• If you have the OpenAI NodeJS SDK v3:        如果你使用的是 OpenAI NodeJS SDK v3

import { Configuration, OpenAIApi } from 'openai';const configuration = new Configuration({apiKey: process.env.OPENAI_API_KEY,
});const openai = new OpenAIApi(configuration);

• If you have the OpenAI NodeJS SDK v4:        如果你使用的是 OpenAI NodeJS SDK v4

import OpenAI from 'openai';const openai = new OpenAI({apiKey: process.env.OPENAI_API_KEY,
});

Problem 2: Using the wrong method name        问题 2:使用了错误的方法名称

You want to use the gpt-3.5-turbo model (i.e., Chat Completions API). Use the proper method name.

你想使用 gpt-3.5-turbo 模型(即 Chat Completions API)。请使用正确的方法名称。

Solution        解决方案

• If you have the OpenAI NodeJS SDK v3:

  • openai.createCompletion <-- Wrong ✘
  • openai.createChatCompletion <-- Correct (works with the Chat Completions API) ✔

• If you have the OpenAI NodeJS SDK v4:

  • openai.completions.create <-- Wrong ✘
  • openai.chat.completions.create <-- Correct (works with the Chat Completions API) ✔

Problem 3: Using the prompt parameter         问题 3:使用了 prompt 参数

You want to use the gpt-3.5-turbo model (i.e., Chat Completions API).

你想使用 gpt-3.5-turbo 模型(即 Chat Completions API)。

The Chat Completions API uses the messages parameter, while the Completions API uses the prompt parameter.

Chat Completions API 使用 messages 参数,而 Completions API 使用 prompt 参数。

Solution

Use the messages parameter instead of the prompt parameter.

使用 messages 参数而不是 prompt 参数。

Final solution

• If you have the OpenAI NodeJS SDK v3, try this:

如果你使用的是 OpenAI NodeJS SDK v3,请尝试以下方法:

import { Configuration, OpenAIApi } from 'openai';const configuration = new Configuration({apiKey: process.env.OPENAI_API_KEY,
});const openai = new OpenAIApi(configuration);try {const chatCompletion = await openai.createChatCompletion({model: 'gpt-3.5-turbo',messages: [{ role: 'user', content: 'Hello world' }],max_tokens: 100,n: 1,stop: '\n',temperature: 1.17,});console.log(chatCompletion.data.choices[0].message);
} catch (error) {console.error(error);
}

• If you have the OpenAI NodeJS SDK v4, try this: 

如果你使用的是 OpenAI NodeJS SDK v4,请尝试以下方法:

import OpenAI from 'openai';const openai = new OpenAI({apiKey: process.env.OPENAI_API_KEY,
});try {const chatCompletion = await openai.chat.completions.create({model: 'gpt-3.5-turbo',messages: [{ role: 'user', content: 'Hello world' }],max_tokens: 100,n: 1,stop: '\n',temperature: 1.17,});console.log(chatCompletion.choices[0].message);
} catch (error) {console.error(error);
}

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • 无人机 PX4 飞控 | EKF2简介与使用方法
  • pyinstaller打包python程序
  • 【LeetCode 算法笔记】155. 最小栈
  • JVM JMM 专题篇 ( 12000 字详解 )
  • 第159天:安全开发-Python-协议库爆破FTPSSHRedisSMTPMYSQL等
  • Redis 篇-初步了解 Redis 持久化、Redis 主从集群、Redis 哨兵集群、Redis 分片集群
  • k8s中的认证授权
  • kubeadm方式安装k8s+基础命令的使用
  • CentOS7更新YUM源
  • 时空大数据平台:激活新质生产力的智慧引擎
  • Python 将矩阵转换为行最简形式 (Row Echelon Form, REF)和列最简形式 (Column Echelon Form, CEF)
  • DB-GPT部署和试用
  • Linux 之父 Linus Torvalds:低调的神话创造者
  • 研究生招生宣传(2024秋)
  • 一步迅速了解Linux
  • angular学习第一篇-----环境搭建
  • hadoop集群管理系统搭建规划说明
  • Logstash 参考指南(目录)
  • Netty 4.1 源代码学习:线程模型
  • npx命令介绍
  • Sublime text 3 3103 注册码
  • Vue UI框架库开发介绍
  • Web Storage相关
  • 设计模式走一遍---观察者模式
  • 使用 Node.js 的 nodemailer 模块发送邮件(支持 QQ、163 等、支持附件)
  • 使用Maven插件构建SpringBoot项目,生成Docker镜像push到DockerHub上
  • 最简单的无缝轮播
  • ​Base64转换成图片,android studio build乱码,找不到okio.ByteString接腾讯人脸识别
  • ​LeetCode解法汇总2182. 构造限制重复的字符串
  • # 利刃出鞘_Tomcat 核心原理解析(七)
  • #常见电池型号介绍 常见电池尺寸是多少【详解】
  • #进阶:轻量级ORM框架Dapper的使用教程与原理详解
  • $.proxy和$.extend
  • $.type 怎么精确判断对象类型的 --(源码学习2)
  • (11)MSP430F5529 定时器B
  • (2015)JS ES6 必知的十个 特性
  • (CVPRW,2024)可学习的提示:遥感领域小样本语义分割
  • (C语言)fread与fwrite详解
  • (C语言)逆序输出字符串
  • (pojstep1.3.1)1017(构造法模拟)
  • (STM32笔记)九、RCC时钟树与时钟 第二部分
  • (第一天)包装对象、作用域、创建对象
  • (二)【Jmeter】专栏实战项目靶场drupal部署
  • (附程序)AD采集中的10种经典软件滤波程序优缺点分析
  • (黑马C++)L06 重载与继承
  • (免费领源码)Python#MySQL图书馆管理系统071718-计算机毕业设计项目选题推荐
  • (七)glDrawArry绘制
  • (四)Controller接口控制器详解(三)
  • (推荐)叮当——中文语音对话机器人
  • (转)Android中使用ormlite实现持久化(一)--HelloOrmLite
  • (转)利用PHP的debug_backtrace函数,实现PHP文件权限管理、动态加载 【反射】...
  • . NET自动找可写目录
  • .net6 当连接用户的shell断掉后,dotnet会自动关闭,达不到长期运行的效果。.NET 进程守护
  • @PostConstruct 注解的方法用于资源的初始化
  • @RestControllerAdvice异常统一处理类失效原因