NextJS将JSON作为响应而不是HTML。

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

NextJS serves JSON as response and not html

问题

I have built a blog site using NextJS. The blog has more content so it is not possible to use GetStaticProps and generate static pages during build time.

我已经使用 NextJS 构建了一个博客网站。博客内容较多,因此无法在构建时使用 GetStaticProps 生成静态页面。

I have tried using GetServerSideProps and also GetStaticProps and GetStaticPath with fallback as blocking. In both the case, nextjs generates html for the first request and subsequent request, it is only calling _next/data and gets json response. I am more interested in getting html response every time as like in express-js or any other web framework. Is there any way in NextJS to get html content every time.

我尝试使用 GetServerSideProps,还尝试使用 GetStaticProps 和 GetStaticPaths,将回退选项设置为 blocking。在这两种情况下,Next.js 仅为第一次请求生成 HTML,而后续请求则只调用 _next/data 并获取 JSON 响应。我更希望每次都能获得 HTML 响应,就像在 Express.js 或任何其他 Web 框架中一样。在 NextJS 中是否有方法可以每次都获取 HTML 内容。

export async function getStaticPaths() {
    return {
        paths: [],
        fallback: 'blocking',
    }
}
export async function getStaticPaths() {
    return {
        paths: [],
        fallback: 'blocking',
    }
}
英文:

I have built a blog site using NextJS. The blog has more content so it is not possible to use GetStaticProps and generate static pages during build time.

I have tried using GetServerSideProps and also GetStaticProps and GetStaticPath with fallback as blocking. In both the case, nextjs generates html for the first request and subsequent request, it is only calling _next/data and gets json response. I am more interested in getting html response every time as like in express-js or any other web framework. Is there any way in NextJS to get html content every time.

export async function getStaticPaths() {
    return {
        paths: [],
        fallback: 'blocking',
      }
  }

答案1

得分: 1

如果因为某些原因您想要“禁用”客户端导航,只需使用常规锚点(a)元素而不是Next.Link组件:

// 将这个
<a href="https://example.com" />
// 改为这个
<a href="https://example.com" />

这样,每次导航都将成为“完全重新加载”的导航,而不是内置的Next.js客户端导航。

英文:

If for some reason you want to "disable" client side navigation just use regular anchor (a) elements instead of Next.Link components:

// Change this
&lt;Link href=&quot;https://example.com&quot; /&gt;
// To this
&lt;a href=&quot;https://example.com&quot; /&gt;

That way every navigation will be "full reload" navigation instead of in-build Next.js client side one.

huangapple
  • 本文由 发表于 2023年4月19日 18:32:14
  • 转载请务必保留本文链接:https://go.coder-hub.com/76053468.html
匿名

发表评论

匿名网友

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

确定