# CORS Policy Blocking Fetch Requests from Twitch Extension to Vercel API

**URL:** <https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021>\
**Category:** Extensions\
**Created:** [July 22, 2025, 10:08am UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021 "2025-07-22T10:08:43Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![mici1708](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/mici1708/32/30919_2.png) [@mici1708](https://discuss.dev.twitch.com/u/mici1708)\
**Post date:** [July 22, 2025, 10:08am UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/1 "2025-07-22T10:08:43Z")

</div>

Hello Twitch Developer Support,

I’m currently developing a Twitch Extension that uses a backend hosted on Vercel. The extension frontend is served from `https://anilistprofile.vercel.app`, and the backend API endpoints are located at `https://anilist-extension.vercel.app/api`.

While testing the extension in Hosted Test mode, I’m encountering a persistent CORS error when trying to send a `fetch()` request from the extension to my backend:

Access to fetch at ‘[https://anilist-extension.vercel.app/api/save-username](https://anilist-extension.vercel.app/api/save-username)’ from origin ‘[https://anilistprofile.vercel.app](https://anilistprofile.vercel.app)’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

I’ve already configured my backend to handle CORS properly by explicitly setting the following headers in the response:

Access-Control-Allow-Origin: [https://anilistprofile.vercel.app](https://anilistprofile.vercel.app)  
Access-Control-Allow-Methods: POST, OPTIONS  
Access-Control-Allow-Headers: Content-Type, Authorization

I also handle `OPTIONS` preflight requests correctly and return a `200` status.

Despite this, Twitch Hosted Test continues to block the request, and the browser reports a failed fetch due to missing CORS headers. I’ve verified that the headers are present when testing the endpoint directly via curl and Postman.

Could this be related to how Twitch Hosted Test enforces Content Security Policy or origin validation? Is there a specific configuration or domain requirement I need to meet for Twitch to allow communication between these two Vercel-hosted domains?

Any guidance or clarification would be greatly appreciated.

Let me know if you’d like to include screenshots, logs, or a link to your extension manifest for context. I can help you format those too 😄

My repository on github: [GitHub - mici1708/anilistprofile](https://github.com/mici1708/anilistprofile/tree/main)

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [July 22, 2025, 5:39pm UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/2 "2025-07-22T17:39:02Z")

</div>

> [@mici1708](#):
>
> Could this be related to how Twitch Hosted Test enforces Content Security Policy or origin validation? Is there a specific configuration or domain requirement I need to meet for Twitch to allow communication between these two Vercel-hosted domains?

Did you set the relevant fields in the CSP in the Extensions Developer Dashboard?

> [@mici1708](#):
>
> Access to fetch at ‘[https://anilist-extension.vercel.app/api/save-username’](https://anilist-extension.vercel.app/api/save-username%E2%80%99) from origin ‘[https://anilistprofile.vercel.app](https://anilistprofile.vercel.app)’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Security headers doesn’t show any CSP headers - [https://securityheaders.com/?q=https%3A%2F%2Fanilist-extension.vercel.app%2Fapi%2Fsave-username&hide=on&followRedirects=on](https://securityheaders.com/?q=https%3A%2F%2Fanilist-extension.vercel.app%2Fapi%2Fsave-username&hide=on&followRedirects=on)

And CURL -X POST-ing

 ![image](https://d2opxh93rbxzdn.cloudfront.net/original/3X/2/4/2426cecb1522223bf7034977a0d58ae5be287185.png)

Shows `DEPLOYMENT_NOT_FOUND`

And a 404 not found will manifest as a CORS header as _generally_ 404 pages don’t have much in the way of headers 😛

---

<div class="post-metadata">

**Author:** ![mici1708](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/mici1708/32/30919_2.png) [@mici1708](https://discuss.dev.twitch.com/u/mici1708)\
**Post date:** [July 22, 2025, 8:04pm UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/3 "2025-07-22T20:04:12Z")

</div>

I have fixed, thanks for your help

---

<div class="post-metadata">

**Author:** ![mici1708](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/mici1708/32/30919_2.png) [@mici1708](https://discuss.dev.twitch.com/u/mici1708)\
**Post date:** [July 22, 2025, 10:40pm UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/4 "2025-07-22T22:40:18Z")

</div>

Now I’m building a Twitch Extension that uses the Config API to store the broadcaster’s AniList username via `window.Twitch.ext.configuration.set()`.

Everything works as expected in the config view (`settings.html`):

- I’m successfully saving to both `"broadcaster"` and `"global"` segments using version `"2.0"`
- Logs confirm the payload is valid and the save call doesn’t throw any errors

However, in the `panel.html` view, I’m not receiving the configuration at all:

- `window.Twitch.ext.configuration.broadcaster` is always `undefined`
- `window.Twitch.ext.configuration.global` is also `undefined`
- This happens both during `onAuthorized` and inside `configuration.onChanged`
- Even with full fallbacks and delays via `setTimeout`, nothing is returned

I’ve tested:

- Multiple versions (`"1.0"`, `"2.0"`, `"3.0"`)
- Full reloads of Hosted Test (not just refresh)
- Saving via broadcaster + global segments
- Logging full SDK state from both views

I’m testing via Hosted Test, but I’m unsure if my panel view is properly linked to the broadcaster identity. Could Twitch be treating it as a viewer and hiding the config?

Any suggestions, known bugs, or workarounds to force propagation of config data into the panel view would be massively appreciated.

New version: [Releases · mici1708/anilistprofile · GitHub](https://github.com/mici1708/anilistprofile/releases)

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [July 22, 2025, 11:07pm UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/5 "2025-07-22T23:07:51Z")

</div>

Did you actually turn the config service on in the developer console.

---

<div class="post-metadata">

**Author:** ![mici1708](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/mici1708/32/30919_2.png) [@mici1708](https://discuss.dev.twitch.com/u/mici1708)\
**Post date:** [July 23, 2025, 7:20am UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/6 "2025-07-23T07:20:36Z")

</div>

![image](https://d2opxh93rbxzdn.cloudfront.net/original/3X/3/b/3b36e1ba437fd3f23353f8adb9ab0d62e6ca466d.png)

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [July 23, 2025, 10:04am UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/7 "2025-07-23T10:04:22Z")

</div>

This is a screenshot of the homepage of the dev console of a version of an extension

The config service toggle is on the Capabilties tab

 ![image](https://d2opxh93rbxzdn.cloudfront.net/original/3X/b/1/b10125bccb3f627466bbc60be228cdc2f54989fc.png)

---

<div class="post-metadata">

**Author:** ![mici1708](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/mici1708/32/30919_2.png) [@mici1708](https://discuss.dev.twitch.com/u/mici1708)\
**Post date:** [July 23, 2025, 10:40am UTC](https://discuss.dev.twitch.com/t/cors-policy-blocking-fetch-requests-from-twitch-extension-to-vercel-api/64021/8 "2025-07-23T10:40:54Z")

</div>

thank you infinitely, now working
