If your Twitch extension Local Test suddenly started throwing a CORS error…

Extensions
1

Spent 5+ hours and finally figured this out…. when my local testing stopped working hope this helps!**

Symptom**

  • You’re using Local Test for a Twitch extension.

  • Your Testing Base URI is something like https://localhost:8080/.

  • The Twitch dashboard iframe points at:

    https://localhost:8080/config.html?anchor=panel&...

  • DevTools → Network shows:

    • config.html?... → Status: CORS error

    • Hover tooltip / details:
      Cross-Origin Resource Sharing error: LocalNetworkAccessPermissionDenied

  • Opening https://localhost:8080/config.html directly in a tab works fine.

What’s actually happening

Your CORS and HTTPS can be totally correct and Chrome will still block it.

Recent Chrome versions added a Local Network Access check. A public HTTPS site (like https://dashboard.twitch.tv) isn’t allowed to embed / talk to localhost or your LAN unless the browser grants special local network access permissions.

Twitch’s dashboard iframe doesn’t request that permission, so Chrome refuses the request and mislabels it as a “CORS error” with LocalNetworkAccessPermissionDenied. Your backend never even gets a chance to respond.

2

And thats why my localtest is on a real SSL domain instead of localhost as it’s a more accurate represenatiation of hosted/release

3

Hi Barry,

Totally new extension dev here and I am having a lot of issues related to chromium localhost permission stuff. Specifically, Cross-Origin Request errors (using the same localhost, just my API endpoint is on a port) and the dreaded “unsafe attempt to load URL - domains protocols and ports must match” error.

Do you have/know of any resources that could help me test using a (as you described) “a real SSL domain” so I can get out of this web permissions hellscape? LOL

I ultimately plan to use something like ngrok or cloudflare tunnel with a host domain name to serve content only for my twitch page (for starters). Can you use such URLs/tunneling services for the “local hosting” phase?

Thanks in advance! I’m excited to see what I can create with these awesome tools! :grin:

4

This is the answer to your question for development.

I use a real domain on my extension EBS with a reverse SSH tunnel so I don’t rely on other tools I use my own. (given the tools like ngrok do pretty much exactly that but you have to use thier service(s) I just use my own server where the production EBS is with additional sub domains for test front end and test backend)

5

Try the flags disable-web-security in a temporary user-data-dir https://stackoverflow.com/a/3177718

Firefox-based browers also work, even with http://localhost:8080.