Add PREVIEW_URL support to other iframes

[f1yn]

Is your feature request related to a problem? Please describe.
For Storybook apps that are hosted on remote CDNs, I've been finding it difficult to enable previews and stories without severe compromises.

Describe the solution you'd like
A clear and concise description of what you want to happen.

Make the PREVIEW_URL global available to other iframes as well

Allow developers to use env variables to override this value: https://github.com/storybookjs/storybook/blob/next/lib/components/src/blocks/Story.tsx#L6

It should look like the already existing:

storybook/lib/ui/src/containers/preview.tsx

Line 45 in b6136e1

baseUrl: PREVIEW_URL || 'iframe.html',

Having this point to a custom location, either relative or remote, would likely help me and other developers who are using storybook in non standard ways. I.e mounted in a microfront-end, or hosted on a remote CDN.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Right now, I'm using a nginx proxy to match /iframe.html to an externally hosted resources. This isn't a suitable solution for a production environment.

Are you able to assist bring the feature to reality?
Doing this now, if you could make it available in the next beta version that would be incredibly helpful. Just realized that this won't work because of same-origin policy.

Additional context
Add any other context or screenshots about the feature request here.

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[f1yn]

This isn't a feature request, it's a bug. The PREVIEW_URL isn't being consistently handled.

[shilman]

@flynnham do you want to fix it?

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[Alonski]

I would also like this feature :)

[SebDuf]

Is there a workaround available for this? I've just stumbled on this and thought changing the PREVIEW_URL would solve my issues, but this is still blocking me.

I'm trying to deploy Storybook under /storybook/, here's what I currently have (as per this comment):

build-storybook --preview-url=/storybook/iframe.html

and in main.js:

...
webpackFinal: (config, {configType}) => {
    if (configType === 'PRODUCTION') {
      config.output.publicPath = '/storybook/';
    }

    return config;
},
managerWebpack: (config, {configType}) => {
    if (configType === 'PRODUCTION') {
      config.output.publicPath = '/storybook/';
    }

    return config;
},