feat(live-preview): supports relative urls for dynamic preview deployments (#9746)
When deploying to Vercel, preview deployment URLs are dynamically generated. This breaks Live Preview within those deployments because there is no mechanism by which we can detect and set that URL within Payload. Although Vercel provides various environment variables at our disposal, they provide no concrete identifier for exactly _which_ URL is being currently previewed (you an access the same deployment from a number of different URLs). The fix is to support _relative_ live preview URLs, that way Payload can prepend the application's top-level domain dynamically at render-time in order to create a fully qualified URL. So when you visit a Vercel preview deployment, for example, that deployment's unique URL is used to load the iframe of the preview window, instead of the application's root/production domain. Note: this does not fix multi-tenancy single-domain setups, as those still require a static top-level domain for each tenant.
This commit is contained in:
@@ -54,6 +54,8 @@ _\* An asterisk denotes that a property is required._
|
||||
|
||||
The `url` property is a string that points to your front-end application. This value is used as the `src` attribute of the iframe rendering your front-end. Once loaded, the Admin Panel will communicate directly with your app through `window.postMessage` events.
|
||||
|
||||
This can be an absolute URL or a relative path. If you are using a relative path, Payload will resolve it relative to the application's origin URL. This is useful for Vercel preview deployments, for example, where URLs are not known ahead of time.
|
||||
|
||||
To set the URL, use the `admin.livePreview.url` property in your [Payload Config](../configuration/overview):
|
||||
|
||||
```ts
|
||||
|
||||
Reference in New Issue
Block a user