craftcms / cms

Build bespoke content experiences with Craft.
https://craftcms.com
Other
3.28k stars 635 forks source link

Craft Live Preview Draft data not returned anymore via GraphQl Service? #5125

Closed Jones-S closed 5 years ago

Jones-S commented 5 years ago

Description

I am not sure, but I think the graphql service does not return draft data anymore when sending the live preview tokens. Could it be that something has changed recently?

I am pretty sure I had a working preview solution, where I have a preview target defined and it would open the frontend vue app, which requests the entry's data via axios and adds the live preview tokens as params.

I am assuming that the curl request should return the draft data as well:

$ curl -H "Content-Type: application/graphql" -d 'query Page{entries(site:["default"],section:["pages"],slug:["page-one"]) {title} }' http://cms.domain.test/api?x-craft-live-preview=bQk6OX2hqK&token=neTGV1eDiMBoBuNArCSo_z-yUwOaSU2o

But this would only return the saved entry not the draft. Same goes for my axios call, where I just get the saved entry.

If you need me to make a fresh install with 3.3.11 I can do that, but it would require some effort, because I can't easily downgrade from 3.4.x-dev.

If you know another way to easily check if the previews are working, please tell me and I am happy to help.

Steps to reproduce

  1. Open live preview iframe and copy preview tokens after changing an entry
  2. Request the entry data via axios (or curl?) by adding tokens
  3. Only saved entry is returned.

Additional info

The only thing I have changed since (which I remember), is that I setup a multisite...

Jones-S commented 5 years ago

I tried to make a fresh install of v3.3.11, set up a basic section, activated graphql, added an entry and requested the entry via curl:

curl -H "Content-Type: application/graphql" -d ' 
  entries(section: ["pages"], slug: ["preview-test"]) {
    slug
    title
  }
}' http://cms.preview.test/api

this works and returns the saved entry. When I open the live preview, change the title and copy the tokens and do the query again:

curl -H "Content-Type: application/graphql" -d ' 
  entries(section: ["pages"], slug: ["preview-test"]) {
    slug
    title
  }
}' http://cms.preview.test/api?x-craft-live-preview=aymESYKrMS&token=p8OdG1yK2fLuDLOK1-8UmOP_ap7fu_QC

It would return the saved entry: Now the question is: maybe curl does not return the preview at all? Or is it indeed the preview not working anymore? This would mean it has nothing to do with a multisite setup...

If it is not the curl, I can take the effort and setup an axios call with 3.3.11 and see if that works, but first I would like to hear your opinion.

Cheers

andris-sevcenko commented 5 years ago

Ah, sorry. Over-eager GraphQL result caching seems to have been the cause of this. Updated the logic to sidestep cache if a preview token is used. Sorry for the oversight!

Should work for you now on 3.4.x-dev. Can you confirm that's the case?

clowerweb commented 4 years ago

Is this issue back? On 3.4.20 I'm getting the same thing. My Axios headers should all be correct:

baseURL: "/actions/graphql/api"
headers: {
  Authorization: "Bearer _6d3GJRAxjwwlKR4LF0AqT7ESx1lbtKS"
  X-Requested-With: "XMLHttpRequest"
  token: "BMhpH0y3veZck2nMASuxUP70dP9pCG7Q"
  x-craft-live-preview: "fnJIPI8ca3"
}

I'm still getting back the published version of the page and not the live preview version. I've cleared all caches and disabled enableGraphQlCaching, but it still only returns the published version.

brandonkelly commented 4 years ago

@clowerweb You only need to pass the token, not the x-craft-live-preview header, and if you are going to pass the token as a header, you must name the header x-craft-token, not just token. (See Preparing external front ends for Live Preview in the docs.)

clowerweb commented 4 years ago

@brandonkelly Thanks for the quick response. I removed the x-craft-live-preview header and changed the token header to x-craft-token, but this results in a 400. The specific error is [error][yii\web\HttpException:400] yii\web\BadRequestHttpException: Unable to verify your data submission. in D:\www\maxon\vendor\yiisoft\yii2\web\Controller.php:190

Here are the headers:

baseURL: "/actions/graphql/api"
headers: {
  Authorization: "Bearer _6d3GJRAxjwwlKR4LF0AqT7ESx1lbtKS"
  X-Craft-Token: "rgEHBCkxBVVXPv1SwaoHXB8OXVdqyALd"
  X-Requested-With: "XMLHttpRequest"
}

Removing the x-craft-token header resolves the 400, but again only shows the published version of the page.

clowerweb commented 4 years ago

I thought maybe it was because the X-CSRF-Token header was missing, but adding that header changes it from a 400 to a 404 for /actions/graphql/api...

brandonkelly commented 4 years ago

Sorry, another issue here is that you can’t preview /actions/... URLs. You need to set up a proper GraphQL API endpoint, per the docs.

brandonkelly commented 4 years ago

Just saw https://github.com/craftcms/cms/issues/6108#issuecomment-630856122 – glad you figured it out!