Netlify Serving Build Object rather than Site Content, Next.js 13.4

Hi,

I recently started having an issue that only happens in my production build deployed on Netlify. My Next.js frontend is deployed at https://www.carterbacon.com (superlative-fairy-8da059.netlify.app) and my Rails api backend is deployed at https://api.carterbacon.com.

After updating the content (text and images) on my homepage via form submission, my homepage shows what I assume is a build object (see below) rather than the site content. This is quite frustrating. Does anyone know how to prevent this from happening?

1:HL[“/_next/static/css/57c2539546470e14.css”,{“as”:“style”}]
0:[“Zg8puOvg5ChDCOuMm-IWy”,[[[“”,{“children”:[“PAGE”,{}]},“$undefined”,“$undefined”,true],“$L2”,[[[“$”,“link”,“0”,{“rel”:“stylesheet”,“href”:“/_next/static/css/57c2539546470e14.css”,“precedence”:“next”}]],[“$L3”,null]]]]]
4:I{“id”:4781,“chunks”:[“185:static/chunks/app/layout-c2a2e8ae8962c5f6.js”],“name”:“UserProvider”,“async”:false}
5:I{“id”:9180,“chunks”:[“272:static/chunks/webpack-88ccadedfc8c32f8.js”,“704:static/chunks/87bc1fd9-a8c002851cd4f60d.js”,“125:static/chunks/125-05bf55d581f8cbb0.js”],“name”:“default”,“async”:false}
6:I{“id”:2306,“chunks”:[“272:static/chunks/webpack-88ccadedfc8c32f8.js”,“704:static/chunks/87bc1fd9-a8c002851cd4f60d.js”,“125:static/chunks/125-05bf55d581f8cbb0.js”],“name”:“default”,“async”:false}
2:[[“$”,“html”,null,{“lang”:“en”,“children”:[“$”,“body”,null,{“children”:[“$”,“$L4”,null,{“children”:[“$”,“$L5”,null,{“parallelRouterKey”:“children”,“segmentPath”:[“children”],“error”:“$undefined”,“errorStyles”:“$undefined”,“loading”:“$undefined”,“loadingStyles”:“$undefined”,“hasLoading”:false,“template”:[“$”,“$L6”,null,{}],“templateStyles”:“$undefined”,“notFound”:“$undefined”,“notFoundStyles”:“$undefined”,“childProp”:{“current”:[“$L7”,null],“segment”:“PAGE”},“styles”:}]}]}]}],null]
3:[[“$”,“meta”,“0”,{“charSet”:“utf-8”}],[“$”,“title”,“1”,{“children”:“BB&S America”}],[“$”,“meta”,“2”,{“name”:“description”,“content”:“BB&S: Lighting People”}],[“$”,“meta”,“3”,{“name”:“viewport”,“content”:“width=device-width, initial-scale=1”}],[“$”,“link”,“4”,{“rel”:“icon”,“href”:“/icon.ico?764099c56c5f0c7b”,“type”:“image/x-icon”,“sizes”:“any”}]]
8:I{“id”:2422,“chunks”:[“370:static/chunks/370-f39690e4467614fc.js”,“265:static/chunks/265-d89d3b7be59b327b.js”,“79:static/chunks/79-f85e708e9ee6bb7d.js”,“955:static/chunks/app/(pages)/products/edit/[slug]/page-2ee4c9b06c47ab1a.js”],“name”:“”,“async”:false}
9:I{“id”:9613,“chunks”:[“370:static/chunks/370-f39690e4467614fc.js”,“931:static/chunks/app/page-d533fd190c9a85df.js”],“name”:“”,“async”:false}
7:[“$”,“div”,null,{“className”:“grid grid–no-navbar”,“children”:[[“$”,“$L8”,null,{“background”:“nav–transparent”,“overlay”:true,“theme”:“nav–light”}],[“$”,“main”,null,{“className”:“home-page”,“children”:[“$”,“$L9”,null,{“heroContent”:{“id”:1,“created_at”:“2023-09-12T23:46:36.473Z”,“button_text”:“View Catalog”,“header_text”:“Lighting Aliens”,“href”:“/categories/”,“images”:[{“byteSize”:5388839,“filename”:“1-TV2-News-08.JPG”,“id”:164,“url”:“http://api.carterbacon.com/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBYVE9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--ee3e4608cd92a86b56911b32bfd37149b41c56f2/1-TV2-News-08.JPG"},{“byteSize”:544700,“filename”:“2-ceiling.jpeg”,“id”:165,“url”:“http://api.carterbacon.com/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBYVU9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--e4755419aed4a9ef49da9a28e1e0146e2f7ea8f6/2-ceiling.jpeg”},{“byteSize”:376098,“filename”:“3-concert-house.jpeg”,“id”:166,“url”:“http://api.carterbacon.com/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBYVk9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--345652dbcf467029ec8173581bfb75a0120e4628/3-concert-house.jpeg”},{“byteSize”:378048,“filename”:"4-Premiere League uStudio.jpeg”,“id”:167,“url”:“http://api.carterbacon.com/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBYWM9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--2831c6303e6cb35839eb65cb2cbdec11fc8fe27a/4-Premiere%20League%20uStudio.jpeg"},{“byteSize”:772082,“filename”:“5-Beamlight_-2.jpeg”,“id”:168,“url”:“http://api.carterbacon.com/rails/active_storage/blobs/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBYWc9IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--69b3247401f337e185fe9f55a3d5e6b910be8c93/5-Beamlight_-2.jpeg”}]}}]}],[“$”,“footer”,null,{“className”:“footer”,“children”:"© 2023 BB&S America”}]]}]

Hi @baconsocrispy , thanks for the post and welcome.

When you say updating the (text and images) on my homepage via form submission, can you explain further.

Thanks.

I am also facing this problem with mysite.
I am using next 14 with contentful.
I need to remove cache for the site, for it to remove the problem.
But it will appear again.
I am using export const revalidate = 60;
Just what is happening?

My site: paradisetranslation.netlify.app

1:HL[“/_next/static/css/ed0d7a1a256f8a0a.css”,“style”]
0:[“e83xB_RTxTchvb1pIQ2-W”,[[[“”,{“children”:[“PAGE”,{}]},“$undefined”,“$undefined”,true],“$L2”,[[[“$”,“link”,“0”,{“rel”:“stylesheet”,“href”:“/_next/static/css/ed0d7a1a256f8a0a.css”,“precedence”:“next”,“crossOrigin”:“$undefined”}]],“$L3”]]]]
4:I[8428,[“428”,“static/chunks/428-ba464adbe67687be.js”,“185”,“static/chunks/app/layout-ea29afa647ebf20a.js”],“”]
5:I[1613,,“”]
6:I[5184,,“”]
2:[null,[“$”,“html”,null,{“lang”:“en”,“children”:[“$”,“body”,null,{“children”:[[“$”,“div”,null,{“className”:“h-40 shadow-lg relative border-gray-600 border-b-2”,“children”:[[“$”,“div”,null,{“className”:“banner-bg-back h-full w-full absolute -z-20”}],[“$”,“div”,null,{“className”:“banner-bg-front h-full w-full absolute -z-10”}],[“$”,“div”,null,{“className”:“p-2 h-full w-full flex flex-col justify-center text-red-800”,“children”:[[“$”,“$L4”,null,{“className”:“text-lg text-center”,“href”:“/”,“children”:“Paradise Translation”}],[“$”,“h2”,null,{“className”:“text-base text-center py-2”,“children”:“Provide you with translated japanese novel pick up!”}]]}]]}],[“$”,“main”,null,{“className”:“p-2”,“children”:[“$”,“$L5”,null,{“parallelRouterKey”:“children”,“segmentPath”:[“children”],“loading”:“$undefined”,“loadingStyles”:“$undefined”,“loadingScripts”:“$undefined”,“hasLoading”:false,“error”:“$undefined”,“errorStyles”:“$undefined”,“errorScripts”:“$undefined”,“template”:[“$”,“$L6”,null,{}],“templateStyles”:“$undefined”,“templateScripts”:“$undefined”,“notFound”:[[“$”,“title”,null,{“children”:“404: This page could not be found.”}],[“$”,“div”,null,{“style”:{“fontFamily”:“system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"”,“height”:“100vh”,“textAlign”:“center”,“display”:“flex”,“flexDirection”:“column”,“alignItems”:“center”,“justifyContent”:“center”},“children”:[“$”,“div”,null,{“children”:[[“$”,“style”,null,{“dangerouslySetInnerHTML”:{“__html”:“body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}”}}],[“$”,“h1”,null,{“className”:“next-error-h1”,“style”:{“display”:“inline-block”,“margin”:“0 20px 0 0”,“padding”:“0 23px 0 0”,“fontSize”:24,“fontWeight”:500,“verticalAlign”:“top”,“lineHeight”:“49px”},“children”:“404”}],[“$”,“div”,null,{“style”:{“display”:“inline-block”},“children”:[“$”,“h2”,null,{“style”:{“fontSize”:14,“fontWeight”:400,“lineHeight”:“49px”,“margin”:0},“children”:“This page could not be found.”}]}]]}]}]],“notFoundStyles”:,“childProp”:{“current”:[“$L7”,“$L8”,null],“segment”:“PAGE”},“styles”:null}]}]]}]}],null]
3:[[“$”,“meta”,“0”,{“name”:“viewport”,“content”:“width=device-width, initial-scale=1”}],[“$”,“meta”,“1”,{“charSet”:“utf-8”}],[“$”,“title”,“2”,{“children”:“Paradise Translation”}],[“$”,“meta”,“3”,{“name”:“description”,“content”:“Provide you with translated japanese novel pick up!”}],[“$”,“link”,“4”,{“rel”:“icon”,“href”:“/favicon.ico”,“type”:“image/x-icon”,“sizes”:“48x48”}]]
7:null
9:I[9467,[“972”,“static/chunks/d0cce76e-5e46f999d012ab58.js”,“116”,“static/chunks/a5092443-6c94b6c672c60b12.js”,“428”,“static/chunks/428-ba464adbe67687be.js”,“748”,“static/chunks/748-e44e4f79be36469f.js”,“131”,“static/chunks/131-3ba22a289a42f770.js”,“931”,“static/chunks/app/page-9f9663249f116955.js”],“”]
8:[“$”,“$L9”,null,{“novels”:[{“id”:“3S2uzynZ7F9CVDdHwrovLp”,“title”:“In Undercover Want To Do Something Cool 〜Hiding Power To Reveal It In The Darkness!”,“category”:“Fantasy”,“tags”:[“R15”,“Comedy”,“Serious”,“Magic”,“Swordman”,“Misunderstandment”,“Man Protagonist”,“Psychopath”,“Protagonist The Strongest”,“Undercover”,“Reincarnation”,“School Life”,“Fantasy”],“cover”:“$undefined”},{“id”:“7c1OL3p0TJPDxOt4Vd0vsT”,“title”:“Our Quest ~Climbing to The Top in Another World with Trash Card~”,“category”:“Fantasy”,“tags”:[“Transported”,“Goddess With Cheat”,“Cheat Card”,“Sunflower TUEE”,“Will Become The Strongest”,“Happy End”],“cover”:“$undefined”}]}]

Seem the problem goes away if I set revalidate to 0.
Mean it will always be SSR and not caching.

thanks for sharing this in the community.

I am also having the same issue using Next 14.1.0 and Sanity as the CMS. I also have export const revalidate = 3600. Reloading usually solves the issue, but sometimes I have to wait a few minutes.

All of this would be fixed in the upcoming updates. Please wait a few weeks.

1 Like

What would be the recommended work around for now? Should we downgrade to a different version of Next.js in the meantime?

Edit:
It seems to only occur when I visit the homepage directly. If I were to visit another page and click on a link for the homepage, then it renders fine.

Yeah I get same issue. And happened on several sites now which resulted in me having to downgrade NextJs to a much older version or host in Vercel.

Great to hear a fix is finally on the way!

Seems to be have ran fine when my data was hard coded into site but when I pulled data in from CMS I got this issue. Not sure if it’s from making the server components that pull this data async functions.

Been looking through the forums to see if anyone else has encountered this issue and it looks like someone else did here: Successfully deployed Next.js 13(App router) project stops displaying UI after some time on my homepage "/"

@rsheppard-dev What version did you end up using for Next.js?
Also were there any difference with deploying to Vercel? Might look into this as a temporary solution.

I also noticed @hrishikesh, you mentioned in an earlier post that it would be resolved in a few weeks, That was back in November 2023. NextJS app and Netlify in production issue - #7 by hrishikesh
Wondering if there is anyway for us to track the progress.

I used 13.3.4 in my last site but had to refactor some stuff as some breaking changes since then like how metadata is injected.

Vercel works no problem.

1 Like

Thank you. I ended up going with Vercel for now.

1 Like

You’d be in for a treat on Monday. But you can also just use Next.js 13.5+ along with Runtime v5 right now: @netlify/plugin-nextjs - npm (npmjs.com)

Is there a native fix now? My site I’m working on currently still suffers with this issue do I need to redeploy or do anything to activate the fix? I’m not using the Netlify plugin currently.

How do I opt in sorry

See here, pretty easy :slight_smile:
Please do update if that resolves the issue! thx

Thanks Elad I still can’t see an opt in on the deploy settings. I have Node v20 running and my logs show me using version 4 something of the runtime. Next Js version 14

You can simply install @netlify/plugin-nextjs@rc to your package.json as well. Just that one the Runtime goes GA, you’d have to remove rc from the package.json so you can get the latest version, or else you’d remain stuck on the rc version.

Thanks! Hopefully this fixes the issue!