我试图将ChatGPT纳入我的实践电子商务网站，将其用作聊天机器人。我导入了openAI并添加了一个功能，该功能向ChatGPT发送消息，然后控制台记录响应。在使用npm run dev运行网站时，我在终端中收到响应，但浏览器收到401错误。由于401错误是缺乏身份验证凭据，我如何接收响应？当我尝试使用useState在页面上呈现响应时，它不起作用。我似乎只能在终端中获得响应。当我在其他非Next.js应用程序中使用凭据时，它确实起作用。我的API密钥在我网站根文件夹中的.env.local文件中。浏览器中的401错误：未处理的运行时错误请求失败，状态代码为401调用堆栈createError node_modules/axios/lib/core/createError.js（16：0）settle node_modules/axios/lib/core/settle.js（17：0）XMLHttpRequest.onloadend node_modules/axios/lib/adapters/xhr.js（66：0）-我发现这令人困惑，因为我没有使用axios。

`import { Configuration, OpenAIApi } from "openai";

const openai = new OpenAIApi(
new Configuration({
apiKey: process.env.API_KEY,
})
);

openai
.createChatCompletion({

model: "gpt-3.5-turbo", 
messages: [
{
  role: "user",
  content:
    "Hello ChatGPT, how are you?",
},
], 
})
.then((res) => {
console.log(res.data.choices[0].message.content); 
}); 

const Stylebot = () => {
return (
<>
  <p>Test ChatGPT</p>
</>
);
};

export default Stylebot;`