Next.js 14调用OpenAI API发GET请求报错：Failed to parse URL from /api/codelang

在Next.js 14中尝试调用OpenAI GPT API并在控制台打印结果时，出现错误：Failed to parse URL from /api/codelang。

错误原因 #

请求的API路径与实际路由文件路径不匹配：

• 页面代码中请求的路径是/api/codelang
• 实际的API路由文件位于app/api/code/route.js，对应路径应为/api/code

修复方案 #

方案1：修改页面中的请求路径

将app/test/page.js里的请求路径从/api/codelang改为/api/code，修改后的代码如下：

export default async function Page() {
  const res = await fetch('/api/code', {
    method: 'GET',
    headers: { 'Content-Type': 'application/json' }
  });
  
  if (res.ok) {
    const data = await res.json();
    console.log(data);
  } else {
    console.error('HTTP error:', res.status, res.statusText);
  }
}

方案2：调整API路由文件的位置

如果需要保留/api/codelang这个请求路径，可将API路由文件夹重命名为codelang，即把app/api/code改为app/api/codelang，确保route.js文件在该文件夹下。

额外注意事项 #

确保项目根目录的.env.local文件中已正确配置OpenAI密钥：

OPENAI_API_KEY=你的OpenAI API密钥

内容的提问来源于stack exchange，提问作者StackUnderFlow