React应用中OpenAI API密钥的.env文件配置问题求助

数据老陈

2026-8-4

解决React中OpenAI API密钥.env配置不生效的问题

以下是针对问题的具体解决步骤：

修正环境变量格式：.env文件中变量值不要加单引号/双引号，正确格式应为：
```
REACT_APP_OPENAI_API_KEY=sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
```
引号会被当作密钥的一部分，导致OpenAI API识别无效密钥。
重启开发服务器：修改.env文件后，必须完全关闭当前的React开发服务（比如终端里Ctrl+C终止），再重新执行npm start启动服务。.env变量仅在服务启动时加载，不重启不会读取新配置。
检查.env文件位置：确保.env文件放在项目根目录下，与package.json、src文件夹同级，不能放在src或其他子目录中。
修正OpenAI配置的属性名：你的代码中Configuration构造函数的属性名写错了，应该是apiKey（首字母大写K），不是apikey，正确代码如下：
```
const configuration = new Configuration({
    apiKey: process.env.REACT_APP_OPENAI_API_KEY
});
```
这个拼写错误会导致密钥无法被正确传入OpenAI客户端，是常见的失效原因。
验证环境变量是否加载：可以在组件中临时添加console.log来确认变量是否被正确读取：
```
console.log(process.env.REACT_APP_OPENAI_API_KEY);
```
如果输出undefined，说明变量未被加载，回到前面的步骤排查；如果输出密钥（注意不要在生产环境打印），则说明配置已生效。