Can't use Local Test mode with Testing Base URI because of X-Frame-Origin

Extensions
1

I would like to test my extension without having to upload the assets and switch to Hosted Test mode, but when I try to use the Testing Base URI feature I get this error.

Refused to display ‘https://localhost.rig.twitch.tv/panel.html?anchor=panel&language=en&locale=en-US&mode=viewer&state=testing&platform=web’ in a frame because it set ‘X-Frame-Options’ to ‘SAMEORIGIN’.

I have set up localhost.rig.twitch.tv on my machine and I can access it fine, but it won’t load the extension. So I have no choice but to keep switching between Hosted and Local Test modes and re-zipping/uploading the files.

Is there anything else I need to configure for this or does it just not work?

2

You are trying to load the http://localhost.rig.twitch.tv/ address ad your Testing Base URI?
You can simply let https://localhost and the port you want and run your extension on your machine, just run the webserver from a terminal.

3

I tried both plain localhost and localhost.rig.twitch.tv and I get the same error.

I am using MAMP for the local server.

The only reason I tried localhost.rig.twitch.tv is because I saw a lot of other people referencing that and I thought maybe that’s what I needed to set up to make it work, but now I see that it’s not.

4

This might be linked to your MAMP configuration.
You should at own you can remove that header from your dev server :slight_smile:

5

You are right. I tried a few configs yesterday and couldn’t figure anything out, but with fresh eyes this morning I was able to get it to work!

For anyone that has this issue, I just added this line to the bottom of my MAMP httpd.conf file.

Header always append Content-Security-Policy "frame-ancestors www.twitch.tv dashboard.twitch.tv supervisor.ext-twitch.tv;"

The Content-Security-Policy header is fairly new, but seems to be compatible with all current browsers.

1 Like