wordpress on different port doesn't run customizer

[tpaksu]

Hi,

When using BrowserSync to develop themes on a different port like 3000, the customizer control pane does show but the preview iframe contents are not loaded and Chrome devtools shows this message:

Refused to display '​http://wordpress.dev:3000/?customize_changeset_uuid=54b01da5-8dc3-4ff9-a3a2-3973cc2cbd22&customize_theme=rettica&customize_messenger_channel=preview-0' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors ​http://wordpress.dev".

Is this related to the browser's iframe policies or can it be fixed within WordPress?

[tpaksu]

I came up with a solution that doesn't modify the wordpress core itself.

​https://wordpress.stackexchange.com/questions/274049/wp-customizer-gulp-browsersync-refused-to-display-in-iframe

This issue may be closed because wordpress might not find out whether it is running via browsersync or directly from the browser itself. I couldn't find a way so solved it with editing the browsersync configuration to pass a parameter to the PHP server.

[westonruter]

Is the home/site_url option set to http://wordpress.dev:3000?

[tpaksu]

Hi Weston,

I'm only using it for browsersync to automating CSS/JS development, I'm not always using port 3000 as the site_url. No problem. I don't need that anymore.