Allow to iframe

Building a product for a customer that is going to be iframe’d into an React app. The React app is going to communicate with the iframe using postMessage.

As the PlayCanvas is reliant on the communication and the fact that is not allowing to be iframe’d we have a quite cumbersome workflow since we have to build the PlayCanvas app first, then launch the new build and copy the id of it in URL to the React app that reloads and the spins up the PlayCanvas.

For dev purpose is would be really really nice if we could iframe in the React App as it would speed up our iteration time significantly.

Hi @martin_hgw,

It’s quite doable right now, though due to browser security concerns you need to use a browser extension. I use this workflow quite often when doing dev on a website that uses a Playcanvas app in an iframe.

You need to add an extension to your browser that enables cross domain iframes (ignore x-frame-options).

On the Firefox browser that would be enough I think. On Chrome after v80 there were additional restrictions added for same site cookies. You will have to disable that check otherwise the playcanvas launch iframe page can’t use your credentials and it will fail to load.

1 Like

Thank you @Leonidas! You saved my day🏅

Can’t make it work in Chrome (Canary) but works in Firefox and that’s all I needed🙏

1 Like

Happy it works for you, it’s a powerful setup. Chrome is getting harder and harder to work with in this kind of scenario, agreed.

Old topic, but is there a way around this restriction for a device that does not have a customizable browser? I’m messing around with a Google Nest Hub device at the moment, and I currently need to do a full build and deploy in order to see changes on device. It would be awesome if I could start both already authed and in an iframe. Maybe something like an auth token option available somewhere, and hitting something like on the device

Not that I know of unfortunately.

You might be able to set up some sort of proxy service that can do something like this where the proxy is already authorised? It’s not something I’ve tried or researched before.