next.js 下一个js 13部署时未获取API数据

lf5gs5x2  于 2023-08-04  发布在  其他
关注(0)|答案(1)|浏览(139)

我有一个从The Dog API获取数据的应用程序。当我在本地构建上测试时,数据呈现得很好,但是当我部署它时,它不能获取数据。我部署了Vercel和Netlify,但两者都无法获取。
Deployed website on Vercel
GitHub Link

// app/page.tsx

import Match from "./match";

const url =
  "https://api.thedogapi.com/v1/images/search?limit=16&has_breeds=1&order=random";

export default async function Home() {
  const data = await fetch(`${url}&api_key=${process.env.API_KEY}`, {
    next: { revalidate: 10 },
  });
  const res = await data.json();

  return (
    <main className="h-screen">
      <Match dogs={res} />
    </main>
  );
}

字符串

  • 我检查了这个问题,并尝试缓存:'no-store',但失败
  • 我试着删除下一个:{ revalidate:10 },但也失败了
41zrol4v

41zrol4v1#

我自己找到了解决办法。我在Vercel上为API键声明了一个环境变量。
check Vercel website

相关问题