Skip to content

Instantly share code, notes, and snippets.

@davist11
Last active Jan 22, 2022
Embed
What would you like to do?
Remix + Craft Live Preview
import { json } from 'remix'
import { gql } from 'graphql-request'
import { gqlClient } from 'graphql.server'
export const loader = async ({ request }) => {
const { entries } = await gqlClient(request).request(gql`
{
YOUR GRAPHQL QUERY HERE
}
`)
return json({ entries })
}
<?php
return [
'*' => [
'headlessMode' => true,
'previewIframeResizerOptions' => [
'checkOrigin' => [
'https://www.trevor-davis.com',
],
],
],
];
import { GraphQLClient } from 'graphql-request'
// Pass through allowed query params to the requst
const getQueryParams = (request) => {
const url = new URL(request.url)
const allowedKeys = ['x-craft-preview', 'x-craft-live-preview', 'token']
const filteredParams = Object.entries(
Object.fromEntries(url.searchParams)
).filter(([key]) => allowedKeys.includes(key))
if (!filteredParams.length) {
return ''
}
const queryString = filteredParams.map((val) => val.join('=')).join('&')
return `?${queryString}`
}
export const gqlClient = (request = null) => {
const queryString = request ? getQueryParams(request) : ''
return new GraphQLClient(`https://your-endpoint-here/${queryString}`, {
headers: {
authorization: `Bearer YOUR_AUTH_TOKEN_HERE`,
},
})
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment