为什么Next.js构建尝试连接到数据库？

velaa5lx 于 2024-01-07 发布在其他

关注(0)|答案(2)|浏览(223)

我在Next.js服务器页面14使用应用程序路由器，将从数据库中获取数据，
这里是创建数据库连接池的位置，位于lib/db.js

import mysql from "mysql2/promise";

import * as schema from "@/schema";

const pool = mysql.createPool({
  ...
});

export const db = drizzle(pool, { mode: "default", schema });

字符串
然后在服务器组件页面中导入上述内容，如下所示，

// create database connection
import { db } from "@/lib/db";

const Dashboard = async () => {
  const result = await db.query.documents.findFirst();
  return (
    <div>...</div>
  );
};

型
这个实现需要一个正在运行的数据库服务器。当npm运行dev或在生产运行时，这是有意义的。
我不清楚的是npm run build也在尝试连接数据库。当数据库服务器没有运行时，构建会失败。
这是怎么回事？

next.js

来源：https://stackoverflow.com/questions/77660750/why-next-js-build-trying-to-connect-to-database

2条答案

按热度按时间

wixjitnu1#

在Next.js中，构建过程默认会预呈现页面。这意味着它会在构建时为每个页面生成HTML。如果您的组件中直接有服务器端函数或数据获取逻辑（如在 Jmeter 板组件中），Next.js将尝试在构建过程中执行它。
由于您的 Jmeter 板组件在渲染期间尝试从数据库获取数据，并且这种渲染发生在构建时，Next.js会在构建期间尝试连接到数据库。如果数据库服务器未运行，这将导致失败。
为了避免这个问题，您应该将数据获取逻辑移动到getServerSideProps或getStaticProps。这些函数是专门为Next.js中的数据获取而设计的，并且仅在getServerSideProps的运行时调用，或者在getStaticProps的构建时（以及可选的运行时）调用。
以下是如何使用getServerSideProps重构 Jmeter 板组件：

import { db } from "@/lib/db";

const Dashboard = ({ data }) => {
  return (
    <div>...</div>
  );
};

export async function getServerSideProps() {
  const result = await db.query.documents.findFirst();

  return { props: { data: result } };
}

export default Dashboard;

字符串

赞(0）回复(0）举报 2024-01-07

flvtvl502#

答案就在这里，will nextjs always require database access at build time on statically generated pages? Or have I screwed up something with my config。

赞(0）回复(0）举报 2024-01-07