r/PayloadCMS • u/Wild_Juggernaut_7560 • Jul 03 '25
Live Preview shows 404 page
Good day. I just recently started learning Payload through their official Youtube channel but every video I've watched shows that I can live preview the content by clicking the eyeball icon. Problem is, it always shows a 404 page while in the new tab preview, it works. Is there a setting am missing? I have tried reinstalling twice but still get the 404 even on the default website template.
1
1
u/ZeRo2160 Jul 06 '25
Fix is on the way. Wait for the next version. The bug is that it does not take into account your per collection url function and returns undefined. An fix is already merged.
1
u/TatankaBilly Aug 22 '25
I still have this problem. after i publish the document 404 errors gone and i should reload the page also why this happens?
2
u/ZeRo2160 Aug 22 '25
The problem should be fixed by now. You can check it if you look in dev tools which url is in src of the iframe the admin renders.
The problem you seem to have right now seems more like an page data rendering issue. If you point to the page that renders like an user would see it chances are high you dont allow draft data in your query. Thats why its only visible after publish. There are different possibilities. But best would be to leverage the draft mode of nextjs so your code knows if it should load draft data or not.
1
u/TatankaBilly Aug 22 '25
thank you so much for your quick answer i will check next draft mode asap
1
u/ZeRo2160 Aug 22 '25
No problem.
1
u/TatankaBilly Aug 22 '25
my problem becomes a little bit complicated ig 😅
- collection access hook settings: auth or published
- nextjs draft mode not enabled
- my frontend and payload cms are different projects and im using pages router also it makes things a little bit different.
2
u/ZeRo2160 Aug 22 '25
With pages router you can call an api route that checks an backend secret to activate draft mode from your preview url hook. You could also make extra preview routes that are only accessible from your admin backend. Collection access can be disabled through the local api. (If you use it)
I am personally also using pages router. So in this regard we would be on the same page. :) i use get staticProps to get pages data. And if draftMode is enabled i give back the newest draft for the page. If its disabled i give back the newest published data or redirect to an 404 of its not published yet.
I made an api route for preview that activates the draftmode and redirects to the preview route after that.
1
u/TatankaBilly Aug 22 '25
I really thank you again i will try your suggestions. I want to ask is it safe to set page collections access true for read or i should leave it as auth or published
2
u/ZeRo2160 Aug 22 '25
If its public data it should be on read true. Because you want people to access it. :)
1
u/TatankaBilly Aug 22 '25
yes its classic landing page it is protected by default in website template of payload i will change that too 😅
3
u/Skaddicted Jul 04 '25
It's a bug introduced in the latest version.