# Issue with "Allowlist config Urls"

**URL:** <https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965>\
**Category:** Extensions\
**Created:** [August 17, 2023, 10:12pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965 "2023-08-17T22:12:35Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 17, 2023, 10:12pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/1 "2023-08-17T22:12:35Z")

</div>

I whitelisted the my backend root url in all the allowlist fields. (config, viewers, images etc…), eventually, I was able to display images, but I still can’t make API calls my endpoints (at least from the config page).

Can you help me?

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 17, 2023, 10:15pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/2 "2023-08-17T22:15:30Z")

</div>

What does the console (browers console) say?

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 17, 2023, 10:51pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/3 "2023-08-17T22:51:16Z")

</div>

Refused to connect to ‘WHITELISTED\_BACKEND\_URL’ because it violates the document’s Content Security Policy.

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 17, 2023, 10:52pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/4 "2023-08-17T22:52:44Z")

</div>

This suggests that

URL Fetching Domains doesn’t contain the stated URL.

For example:

 ![image](https://d2spem0quai2ol.cloudfront.net/original/3X/a/2/a2d930faebb2c1c825e9b07ea165ab419cf1345a.png)

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 17, 2023, 10:54pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/5 "2023-08-17T22:54:45Z")

</div>

Oh! Didn’t read the text for this input.  
Gonna check it out rn and report back

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 17, 2023, 11:11pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/6 "2023-08-17T23:11:40Z")

</div>

I had to add Cors, but then It worked 🥳  
Thank you bro

I came across another issue, in case you could help 🙏  
What is the behaviour for twitch.configuration.broadcaster

I set it with a new value, but:

- When I called to check “twitch.configuration?.broadcaster?.content”, it was the same old value.
- twitch.configuration.onChanged was not triggered. I read in the docs that it should be triggered once only, on load. But the name doesn’t suit it, so I thought maybe a typo.

Should conclude from this that “twitch.configuration.broadcaster.content” is only usable on load, but never during the actual lifetime of the page?

Does this apply to the viewer as well? this would be problematic.  
Viewers should get the latest info when the broadcaster updates the config

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 17, 2023, 11:14pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/7 "2023-08-17T23:14:14Z")

</div>

> [@drago](#):
>
> twitch.configuration.onChanged was not triggered. I read in the docs that it should be triggered once only, on load. But the name doesn’t suit it, so I thought maybe a typo.

that is correct it’s triggered only once when it’s initially loaded

> [@drago](#):
>
> Does this apply to the viewer as well? this would be problematic.  
> Viewers should get the latest info when the broadcaster updates the config

Then you’d need to use extension pubsub other another medium to distribute the updated config.

Since I generally use a server to set configs I take this approach

> <https://github.com/BarryCarlyon/twitch_misc/blob/main/extensions/config_service/set_n_publish.js>

I call set config then send the same config out over pubsub to listening clients to reconfigure

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 17, 2023, 11:19pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/8 "2023-08-17T23:19:14Z")

</div>

Ok, I see. Why not! 🦖  
I’ll test it out and report back … you’re the best @BarryCarlyon

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 18, 2023, 2:47pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/9 "2023-08-18T14:47:54Z")

</div>

GM 🙂

I made a few tests to populate the configurations on the backend by activating “Custom/My Own Service”.

I found that once I populated the configuration from the back-end, I’m no longer able to get/set the configurations on config.html (onChange is returning an empty object).  
So I have a couple of questions:

- Is it possible to use both, backend in tandem with the frontend for configurations?  
According to the animals-facts example, this seems possible. But it doesn’t work for me for some reason.  
[https://github.com/twitchdev/animal-facts/blob/main/src/components/App/App.js](https://github.com/twitchdev/animal-facts/blob/main/src/components/App/App.js)

- I, sort of, understood the utility of the “Required Per Channel Configuration” field. But I’m not sure how to use it. Is there an example or process explanation?

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 18, 2023, 2:52pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/10 "2023-08-18T14:52:40Z")

</div>

If you want to use the Twitch Configuration service you must select  
`Extension Configuration Service`

 ![image](https://d2spem0quai2ol.cloudfront.net/original/3X/9/c/9cec6c5f07e8d39af304dcbfce0d4cfa0eaeec4d.png)

This does not stop you storing configuration seperately

You would only select `Custom/My Own Service` if you are intending to use

 ![image](https://d2spem0quai2ol.cloudfront.net/original/3X/4/a/4a90abd61f70df7b1842e741c90e4397437e778e.png)

to block activation using [Extensions Reference | Twitch Developers](https://dev.twitch.tv/docs/extensions/reference/#set-extension-required-configuration)

> [@drago](#):
>
> Is it possible to use both, backend in tandem with the frontend for configurations?

Yes but you _MUST_ select `Extension Configuration Service`

> [@drago](#):
>
> I, sort of, understood the utility of the “Required Per Channel Configuration” field. But I’m not sure how to use it. Is there an example or process explanation?

This means that can use _force_ a streamer to configure your extension first, storing config into an external something  
Then you call [Extensions Reference | Twitch Developers](https://dev.twitch.tv/docs/extensions/reference/#set-extension-required-configuration) to say that “configuration is complete and the streamer may not activate the extension into a slot”

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 18, 2023, 4:56pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/11 "2023-08-18T16:56:36Z")

</div>

That’s much better.  
I hope this is my last question, the configuration saved using the back-end is not the same as the front-end’s.

I suspected it is related to the version, but:

- My app’s version is 0.0.1
- On the front-end, I’m using: twitch.configuration.set(“broadcaster”, “1”, JSON.stringify(config))
- On the back-end, I tried setting the version to both “1” & “0.0.1” on PUT “[https://api.twitch.tv/helix/extensions/configurations](https://api.twitch.tv/helix/extensions/configurations)”
- On the back-end, for fetching configurations, there is no version parameter.

My test was very simple:  
set backend =\> reload the extension & check onChange =\> set on the front-end =\> check on the back-end

Is it the intended behavior?

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 18, 2023, 5:02pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/12 "2023-08-18T17:02:27Z")

</div>

> [@drago](#):
>
> I hope this is my last question, the configuration saved using the back-end is not the same as the front-end’s.

Just to clarify

if you use the API or the JS helper to set the extension config service they should be the same.

You can choose not to use the config service and store information in your database instead.

> [@drago](#):
>
> - My app’s version is 0.0.1

The version of your extension is irrelevant.

> [@drago](#):
>
> On the front-end, I’m using: twitch.configuration.set(“broadcaster”, “1”, JSON.stringify(config))

You wrote to the config segment and said that it is version “1”

> [@drago](#):
>
> On the back-end, for fetching configurations, there is no version parameter.

The version is returned with the contents of the config.  
It’s not a paramter it is “part” of the config

> **[Reference](https://dev.twitch.tv/docs/api/reference/#get-extension-configuration-segment)**
>
> Twitch Developer tools and services to integrate Twitch into your development or create interactive experience on twitch.tv.

example response:

```auto
{
  "data": [
    {
      "segment": "global",
      "content": "hello config!",
      "version": "0.0.1"
    }
  ]
}

```

The extension config service only stores one item of configuration per segement.  
That item of configuration may or may not have a version attached to it. Versions are used to block/allow activation of the extension into a slot.

You cannot “load” version “0.0.1” if you set a config of version “1” theres no history/way to load older configurations.

If you don’t want to block activation of an extension to force configuration first don’t use versioning.

I fear you are getting confused over the purpose of the version attached to the configuration.

If the version set with config matched the version set in the dashboard, allow activation.

That version can be a string of any format/content, even as simple as “ok” doesn’t need to be numeric.

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 18, 2023, 5:13pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/13 "2023-08-18T17:13:16Z")

</div>

The fact that I’m not getting the same config, is why I’m questioning the version parameter.  
Now the version set in the admin (Broadcaster Writable Channel Segment Version), front & back is the same (1), but still the config is not matching.

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 18, 2023, 5:13pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/14 "2023-08-18T17:13:46Z")

</div>

Sure you are using the right user\_id?

it is working as expected here:

 ![image](https://d2spem0quai2ol.cloudfront.net/original/3X/f/c/fce5bf467aa1b082ba9cf453557101db17452613.png)

I then do in console of the extension

`window.Twitch.ext.configuration.set('broadcaster', '100', '{"what":"TodayIsFriday"}');`

And now on reload

 ![image](https://d2spem0quai2ol.cloudfront.net/original/3X/b/8/b8cb829a6557c19f67cbbd062d66309df55d28d8.png)

And then using backend to set

 ![image](https://d2spem0quai2ol.cloudfront.net/original/3X/6/8/681dc8729c3a3832bfcd58fc9557084ede87c0d7.png)

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 18, 2023, 5:17pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/15 "2023-08-18T17:17:19Z")

</div>

I got the userId from the auth object on the front,  
channel\_id: 9412xxxx  
user\_id: U9412xxxx

_(this is really confusing!!)_

I was using, user\_id, now tried with channel\_id and on the back I received the front-config.  
But not able to set it correctly, I’ll debug this now

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 18, 2023, 5:18pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/16 "2023-08-18T17:18:45Z")

</div>

I thought if the userId was not correct, the API would throw an error.  
Didn’t expect to save config in the void haha

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 18, 2023, 5:19pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/17 "2023-08-18T17:19:07Z")

</div>

> [@drago](#):
>
> user\_id: U9412xxxx

user id’s everywhere do not have a prefix.

It seems when talking to the API you have used the opaque user id which is what `user_id` is from the onAuth object.

> **[Extensions Reference](https://dev.twitch.tv/docs/extensions/reference/#onauthorized)**
>
> Extensions Reference

the userID returned in on auth is `Opaque user ID` which is “more like” a session ID than anything that actually represents a user.

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 18, 2023, 5:19pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/18 "2023-08-18T17:19:31Z")

</div>

> [@drago](#):
>
> Didn’t expect to save config in the void haha

It might have throw an error that you didn’t catch as you didn’t have a `onError` callback bound.

> **[Extensions Reference](https://dev.twitch.tv/docs/extensions/reference/#onerror)**
>
> Extensions Reference

---

<div class="post-metadata">

**Author:** ![drago](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/drago/32/25861_2.png) [@drago](https://staging-discuss.dev.twitch.com/u/drago)\
**Post date:** [August 18, 2023, 5:23pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/19 "2023-08-18T17:23:27Z")

</div>

_The opaque id is the actual user id prefixed by a U, which might make sense._

👆This might be wrong 👆

I’ll try to fetch the user\_id from the back end

The fetch function didn’t throw any error, and the config got save and was able to retrieve it, will do a couple more tests to understand the behavior better…

will update this thread…

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://staging-discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [August 18, 2023, 5:31pm UTC](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965/20 "2023-08-18T17:31:57Z")

</div>

> [@drago](#):
>
> _The opaque id is the actual user id prefixed by a U, which might make sense._
> 
> 👆This might be wrong 👆

It’s only this when the viewer that is using the extension _is_ the broadcaster.

It’s much safer to consider this data value as the opaque session id and save confusion.

Then use the channel\_id returned in onAuthorized for your configuration calls.

See [Extensions Reference | Twitch Developers](https://dev.twitch.tv/docs/extensions/reference/#jwt-schema) → opaque\_user\_id for a good explanation.

> [@](#):
>
> Identifies the session using this JWT. Any token generated by your EBS should leave this field blank. When present, the value is interpreted as follows:
> 
> - Values beginning with “U” are stable references to a Twitch account across sessions and channels. You can use them to provide persistent services to users.
> - Values beginning with “A” are transient references to an anonymous Twitch session; the user has not logged into the Twitch website. _These values are not stable and should never be associated with persistent data._ It is possible for them to represent different users over time. If your extension requires a stable user identity, your front-end interface should display an appropriate login request when this field does not begin with “U.”
> 
> Broadcasters’ tokens are set with “U” + their Twitch user IDs, to avoid confusing opaque IDs with user IDs when the broadcaster is a viewer.

> [@drago](#):
>
> The fetch function didn’t throw any error, and the config got save and was able to retrieve it, will do a couple more tests to understand the behavior better…

Yeah looks like that API doesn’t validate the passed in ID is a real user ID or not.

So if you did a API call to save data into `fred` you’ll never be able to retrieve that on the front end. Since onChanged will only the same `channel_id` from onAuthorized to fetch configuration with

[Next page](https://staging-discuss.dev.twitch.com/t/issue-with-allowlist-config-urls/46965.md?page=2)