I'm having issues getting the preview working on localhost (I've disabled it on my live website). I understand this should work out of the box, but it is not not at the moment. I see the Prismic - loading preview message, but the content on the page does not change.
More information, and I'm not sure if all of this is relevant:
The site is generated using target: static in Nuxt config. The prismic module is configured like this:
prismic: {
endpoint: 'https://ramkumarshankar.cdn.prismic.io/api/v2',
preview: process.env.NODE_ENV !== 'production' ? true : false, // turn off preview in production
},
The link resolver includes the custom types in my prismic repository.
I've set up the preview in Prismic settings - the domain is set to http://localhost:3000 and link resolver is /preview
I've tried comparing the config with the nuxtjs-website repo and I haven't spotted any red flags.
Looking at the troubleshooting steps - I entered the token which looks like https://ramkumarshankar.prismic.io/previews/[long_string]?websitePreviewId=[another_string] in here https://ramkumarshankar.prismic.io/api/v1/documents/search?ref=[token here] and that returns the documents in my repository, with unpublished updates. Which tells me that the token is coming in but my query isn't using fetching from the new ref?
I've also looked at the link resolver, and I don't know what could be causing this issue.
Lastly - and I'm not sure if this is relevant at all - I also see some 404 errors in the console getting https://ramkumarshankar.prismic.io/toolbar/state from https://ramkumarshankar.prismic.io/prismic-toolbar/3.0.4/iframe.html when trying to preview a page.
The github repository for my site can be found here.
I'm currently stuck on this, and any help will be much appreciated. Thank you!
Edit:
Just adding that I get a page not found error on new pages, which have not been published yet. For pages that are already published, updates to their content (in draft state) are not reflected in the preview. I still see the published version.
I’ve been digging into this a bit more, and I can see the preview() method being called correctly in the @nuxtjs/prismic module.
// node_modules/@nuxtjs/prismic/src/templates/plugins/prismic.js (lines 69-85)
async preview() {
let url = '/'
const { token, documentId } = query
if (token) {
const previewResolver = await this.api.getPreviewResolver(token, documentId)
const maybeUrl = await previewResolver.resolve(this.linkResolver, '/')
if (maybeUrl) {
url = maybeUrl
}
}
if (process.server) {
redirect(302, url)
} else {
window.location.replace(url) // <-- program gets to this line, and redirects to the url
}
},<% } %>
Specifically, process.server is false on the preview page and the program gets to the last line window.location.replace(url), which just results in a redirection to the url of the page. If the page has been published, I see the older published content. If the page has never been published, I get a page no found error.
I’m not sure about the intended behaviour of the prismic_preview middleware, but process.server is true when the middleware is invoked. So, this function returns.
// node_modules/@nuxtjs/prismic/src/templates/middleware/prismic_preview.js
Middleware.prismic_preview = async ({ route, $prismic }) => {
// Ignore on server
if (process.server) return // <-- function returns because process.server is true
// Ignore if not generated
if (!process.static) return
// Ignore if no preview mode
if (!$prismic.isPreview) return
const Components = getMatchedComponents(route)
Components.forEach(Component => Component.options.static = false)
}
Any chance someone from Prismic can help out with this?
So I finally figured this out. Your repository was on an older group of repositories which was using the old toolbar V1 and the @nuxt/prismic module previews only work with toolbar V2.
You can tell if your repository is using V2 of the toolbar if the script it your repository preview settings includes ?new=true like below.
I moved your repository to the correct group for you so this should work now
For any users in the future with this issue you can contact the activations team as described in the following thread and ask for us to activate V2 of the toolbar for you.
