How to create links to preview content for a specific Uniform release

When using Uniform releases, you can schedule some content to be available at a specific time and date. Sometimes you may want to preview how this site would look like when the release is launched. Uniform SDK provides an attribute called releaseId to pass into the RouteClient.

Here is an example scenario:

Identify where you would like to pass the release id value. Most common option is the query string
Pass the value into the RouteClient

NextJS Page Router: You can add it in requestOptions under withUniformGetStaticProps or withUniformGetServerSideProps like this:

[[...slug]].tsx

export const getStaticProps = withUniformGetStaticProps({ requestOptions: context => ({ state: Boolean(context.preview) || process.env.NODE_ENV === 'development' ? CANVAS_DRAFT_STATE : CANVAS_PUBLISHED_STATE, releaseId: context?.query?.releaseid as string, }),

NextJS App Router:

Add it like this for the retrieveRoute call:

const route = await retrieveRoute(propsWithLangPath, { releaseId: '95472b77-881d-4aaa-9ef2-ed974e35c819' });

Using query string like this may exposes the not published content from the release to the public. Anyone with the release ID value may be able to see those pages. You might consider adding an additional key or secret to prevent an unnecessary access.

How to use it?

Make sure the content is in the published state
Note the URL of the page, e.g. https://your.site/page/path
When you are editing any content under a release, note the release id from the release query string parameter in URL. Or open the release and check the last ID from the URL
Combine the URL like this: https://your.site/page/path?releaseid=your_release_id_value