Implementation of preview is not quite clear with the API

[ahmad2x4]

Hi,

I want to implement preview feature using the SDK however it it not quite obvious what needs to be done to get the preview feature of prismic.io working.

Based on prismic documentation, first we need to setup an environment How to setup a preview.

Then obviously you need an endpoint for preview in your application. Which receives Token as query string parameter. Then we need to pass this parameter to a DocumentLinkResolver to find the correct URL Based on the type of document Something like following code

public async Task OnGet(string token, string documentId)
{
            var linkResolver = LambdaDocumentLinkResolver.For((documentLink) => 
                         documentLink.Type == "blog" ? $"/blog/{documentLink.Uid}" : "/"
            );
            var api = await _prismic.GetApi();
            var url = await api.PreviewSession(token, linkResolver, "/");
            Response.Redirect(url);
}

Well this will work and redirects to the right endpoint however the key point to be able to get the preview is to set a cookie io.prismic.preview so that the next endpiont pass it as ref. Then prismic would understand that this is related to the preview of that content and not the master version. For example if the blog endpoint looks like something like this:

public async Task OnGet()
{
            var api = await _prismic.GetApi();

          var forms = await api.Query(Predicates.At("document.type", "blog"))
            .PageSize(10)
            .Submit();

         //show view 
}

Then if that cookie is set SDK will bass it to the prismic and prismic will return preview rather that master version.

The problem is I don't know whose responsibility is to set that Cookie. There is a workaround to this however I am not sure if there is better way in SDK or not: the token preview comes with following format

https://YOURREPO.prismic.io/previews/#SOMECODE?websitePreviewId=#PREVIEWID

If I set the cookie to #SOMECODE then prismic return preview version of the content.

Please let me know if am missing something here

[benembery]

Hi @ahmad2x4,

Thanks for raising this, you are right this is not clear at all.

try
{
    var api = await _prismicProvider.GetApi();
    var url = await api.PreviewSession(token, _linkResolver, "/");

    Response.Cookies.Append(Api.PREVIEW_COOKIE, token, new CookieOptions
    {
        Expires = DateTime.Now.AddMinutes(30),
    });

    return Redirect(url);
}
catch (Exception)
{
    return Redirect("/");
}

I usually build a middleware or controller action to handle these previews. However, you have to set the cookie yourself. When and HttpContext is available the kit will automatically detect previews and experiment cookies and fallback to the master ref so once the cooke is set you should not have to worry about this.

However, the API Client will throw a preview exception if the preview expires and the cookie is still set. This can be awkward for content editors if the site suddenly starts throwing exceptions. To mitigate this there is a further piece of middleware available in the new kit that can be enabled in the Startup.Configure method like this.

app.UsePrismicPreviewExpiredMiddleware();

I'll update the samples when I get a chance to inlcude handling previews and using the preview expired middleware.

[ahmad2x4]

Thanks @benembery for clarification.

I am happy to update the sample and send a pull request if that's OK

[benembery]

@ahmad2x4 thanks for the offer, but I managed to do it on the weekend, I've just pushed it to the dev branch if you want to have a look.