app static to dynamic error. Sentry nextjs

huangapple go评论74阅读模式
英文:

app static to dynamic error. Sentry nextjs

问题

I see your request for a translation. Here's the translated content from your message:

我在尝试在Kubernetes pod上编译Next.js前端时遇到了500错误。我正在使用以下命令:

npm i --force
npm run build
npm run start

这是错误信息:

页面在运行时从静态切换为动态,原因:headers
更多信息请查看这里https://nextjs.org/docs/messages/app-static-to-dynamic-error
在/app/.next/server/chunks/827.js中的Object.staticGenerationBailout:26985:21
在/app/.next/server/chunks/827.js中的headers:26854:39
在/app/.next/server/chunks/500.js中的Object.apply:78:82
在/app/.next/server/chunks/827.js中的T:27630:25
在/app/.next/server/chunks/827.js中的Ma:27793:33
在/app/.next/server/chunks/827.js中的Array.toJSON:27586:32
在<string>中的stringify
在/app/.next/server/chunks/827.js中的V:27885:53
在node:async_hooks:341:14中的AsyncLocalStorage.run
在/app/.next/server/chunks/827.js中的Object.start:27997:32

我怀疑问题可能与我的Sentry配置有关,因为前端在我不使用Sentry时运行正常。以下是我的Sentry配置在page/_error.js文件中的代码:

import * as Sentry from '@sentry/nextjs';
import NextErrorComponent from 'next/error';

const SENTRY_DSN = process.env.NEXT_SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN;
const isSentryEnabled = !!SENTRY_DSN;

if (isSentryEnabled) {
  Sentry.init({
    dsn: SENTRY_DSN,
  });
}

const CustomErrorComponent = ({ statusCode, hasGetInitialPropsRun, err }) => {
  if (isSentryEnabled) {
    Sentry.captureException(err);

    if (!hasGetInitialPropsRun && err) {
      Sentry.captureException(err);
      return <NextErrorComponent statusCode={500} />;
    }

    // Render the default Next.js error page with the status code
    return <NextErrorComponent statusCode={statusCode} />;
  }

  // Render the default Next.js error page with the status code
  return <NextErrorComponent statusCode={statusCode} />;
};

CustomErrorComponent.getInitialProps = async (context) => {
  if (isSentryEnabled) {
    if (context.err) {
      Sentry.captureException(context.err);
    }

    const { res, err, asPath } = context;

    if (res && res.statusCode === 404) {
      return { statusCode: 404 };
    }

    const hasGetInitialPropsRun = Boolean(err);
    if (err) {
      Sentry.captureException(err);
    }

    const initialProps = await NextErrorComponent.getInitialProps(context);
    return { ...initialProps, hasGetInitialPropsRun, err, asPath };
  } else {
    const initialProps = await NextErrorComponent.getInitialProps(context);
    return { ...initialProps };
  }
};

export default CustomErrorComponent;

我已将配置更改为默认的Sentry Next.js:

import * as Sentry from "@sentry/nextjs";
import NextErrorComponent from "next/error";

const CustomErrorComponent = props => {
  Sentry.captureException(props.err); // 将错误捕获到Sentry中
  return <NextErrorComponent statusCode={props.statusCode} />;
};

CustomErrorComponent.getInitialProps = async contextData => {
  Sentry.captureException(contextData.err); // 将错误捕获到Sentry中
  return {
    statusCode: contextData.res?.statusCode ?? 500,
    // 将以下内容设置为null以禁用此页面的"Static Generation"优化
    getStaticProps: null,
    getStaticPaths: null,
  };
};

export default CustomErrorComponent;

并尝试在运行构建过程时防止渲染Sentry _error.js文件:

npm run build

我已经尝试更改Next.js的版本。

我的一些依赖项包括:

  • next-auth@4.20.1
  • next@13.1.6
  • @next/font@13.1.6
  • @sentry/nextjs@7.43.0
  • @next-auth/sequelize-adapter@1.0.7
  • @next-auth/typeorm-legacy-adapter@2.0.1
英文:

I'm encountering a 500 error when attempting to compile a Next.js frontend on a Kubernetes pod. I'm using the following commands:

npm i --force
npm run build
npm run start

this is the error:

Page changed from static to dynamic at runtime /story/0d3778b0-9e86-4b0a-a043-ed892f2417a0, reason: headers                                                                                              see more here https://nextjs.org/docs/messages/app-static-to-dynamic-error                                                                                                                                   at Object.staticGenerationBailout (/app/.next/server/chunks/827.js:26985:21)                                                                                                                            at headers (/app/.next/server/chunks/827.js:26854:39)                                                                                                                                                   at Object.apply (/app/.next/server/chunks/500.js:78:82)                                                                                                                                                  at T (/app/.next/server/chunks/827.js:27630:25)                                                                                                                                                          at Ma (/app/.next/server/chunks/827.js:27793:33)                                                                                                                                                       at Array.toJSON (/app/.next/server/chunks/827.js:27586:32)                                                                                                                                             at stringify (&lt;anonymous&gt;)                                                                                                                                                                             at V (/app/.next/server/chunks/827.js:27885:53)                                                                                                                                                        at AsyncLocalStorage.run (node:async_hooks:341:14)                                                                                                                                                       at Object.start (/app/.next/server/chunks/827.js:27997:32)

I suspect that the issue may be related to my Sentry configuration, as the front-end works fine when I don't use Sentry. Here is the code for my Sentry configuration in the page/_error.js file:

import * as Sentry from '@sentry/nextjs';
import NextErrorComponent from 'next/error';

const SENTRY_DSN = process.env.NEXT_SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN;
const isSentryEnabled = !!SENTRY_DSN;

if (isSentryEnabled) {
Sentry.init({
dsn: SENTRY_DSN,
});
}
const CustomErrorComponent = ({ statusCode, hasGetInitialPropsRun, err }) =&gt; {
if (isSentryEnabled) {
Sentry.captureException(err);
if (!hasGetInitialPropsRun &amp;&amp; err) {
Sentry.captureException(err);
return &lt;NextErrorComponent statusCode={500} /&gt;;
}
// Render the default Next.js error page with the status code
return &lt;NextErrorComponent statusCode={statusCode} /&gt;;
}
// Render the default Next.js error page with the status code
return &lt;NextErrorComponent statusCode={statusCode} /&gt;;
};
CustomErrorComponent.getInitialProps = async (context) =&gt; {
if (isSentryEnabled) {
if (context.err) {
Sentry.captureException(context.err);
}
const { res, err, asPath } = context;
if (res &amp;&amp; res.statusCode === 404) {
return { statusCode: 404 };
}
const hasGetInitialPropsRun = Boolean(err);
if (err) {
Sentry.captureException(err);
}
const initialProps = await NextErrorComponent.getInitialProps(context);
return { ...initialProps, hasGetInitialPropsRun, err, asPath };
} else {
const initialProps = await NextErrorComponent.getInitialProps(context);
return { ...initialProps };
}
};
export default CustomErrorComponent;

I changed the configuration to a default sentry nextjs

import * as Sentry from &quot;@sentry/nextjs&quot;;
import NextErrorComponent from &quot;next/error&quot;;
const CustomErrorComponent = props =&gt; {
Sentry.captureException(props.err); // Capture the error in Sentry
return &lt;NextErrorComponent statusCode={props.statusCode} /&gt;;
};
CustomErrorComponent.getInitialProps = async contextData =&gt; {
Sentry.captureException(contextData.err); // Capture the error in Sentry
return {
statusCode: contextData.res?.statusCode ?? 500,
// Set the following to null to disable &quot;Static Generation&quot; optimization
// for this page
getStaticProps: null,
getStaticPaths: null,
};
};
export default CustomErrorComponent;

and attempting to prevent the rendering of the Sentry _error.js file when I run the build process.

npm run build

I already tried change the versions of nextJs

Some of my dependencies are:

- next-auth@4.20.1
- next@13.1.6
- @next/font@13.1.6
- @sentry/nextjs@7.43.0
- @next-auth/sequelize-adapter@1.0.7
- @next-auth/typeorm-legacy-adapter@2.0.1

答案1

得分: 0

这似乎是一个 Next.js 问题。查看 此问题,他们声称该问题已在 v13.1.6-canary.0 中修复。有些人声称将版本回滚到 3.1.1 也解决了问题。尝试升级/降级版本,看看问题是否仍然存在。

英文:

I think this is a Next.js problem. Check out this issue where they claim that the issue has been fixed in v13.1.6-canary.0. Some people claim that reverting back to version 3.1.1 fixed the issue. Try upgrading/downgrading the version and see if the issue still persists.

huangapple
  • 本文由 发表于 2023年4月6日 20:16:43
  • 转载请务必保留本文链接:https://go.coder-hub.com/75949419.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定