# How to get and listen realtime channel events in JavaScript **URL:** \ **Category:** API\ **Created:** [March 24, 2021, 12:43pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985 "2021-03-24T12:43:37Z")\ **Posts on this page:** 13\ **Page:** 1
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 24, 2021, 12:43pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/1 "2021-03-24T12:43:37Z")
Hello there, I would like to create a program in HTML/CSS/JS that I can integrate as a Browser Source into OBS Studio. In this program, I would like to **LISTEN & GET multiple events that trigger into my channel when I’m live** (follows, subs, messages in the chat, bits, etc). The idea is to **get a JSON response with all the information about the event** , that I can **manipulate in JavaScript** and display it in HTML/CSS. For example, if someone follows the channel, I would like to get his nickname. And if someone gives bits, I would like to get his nickname and the amount of bits. All of those examples could be given by the JSON response of the API. Is it possible to guide me into the Twitch API documentation with what I’m looking for ? If what I’m looking for is possible of course. Thank you so much for your help ! Peace ✌ ---
**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:** [March 24, 2021, 12:46pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/2 "2021-03-24T12:46:13Z")
In pure clientside - Followers - [https://dev.twitch.tv/docs/api/reference#get-users-follows](https://dev.twitch.tv/docs/api/reference#get-users-follows) - Long Poll for updates - Bits - [https://dev.twitch.tv/docs/pubsub](https://dev.twitch.tv/docs/pubsub) - Twitch will send data to the socket when data occurs. - Subscribers - pubsub as well - Chat - [https://dev.twitch.tv/docs/irc](https://dev.twitch.tv/docs/irc) - Chat over websockets. For pure client side you’d normally use implicit auth [https://dev.twitch.tv/docs/authentication/getting-tokens-oauth#oauth-implicit-code-flow](https://dev.twitch.tv/docs/authentication/getting-tokens-oauth#oauth-implicit-code-flow) ---
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 24, 2021, 12:48pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/3 "2021-03-24T12:48:25Z")
Hi Barry, Thank you so much for this quick answer, I will check it out and see what I can do with it ! 🙂 ---
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 24, 2021, 1:04pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/4 "2021-03-24T13:04:36Z")
Just an other question, how can I listen to events ? Like, when I’m connected with the implicit auth, how can I listen to events ? Is there any function in JavaScript ? Thank you so much for your help ! 🙂 ---
**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:** [March 24, 2021, 1:07pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/5 "2021-03-24T13:07:09Z")
> [@DuckenScott](#): > > Like, when I’m connected with the implicit auth, how can I listen to events ? Is there any function in JavaScript ? Connect to pubsub. PubSub is a websocket protocol, so you can just raise a client side socket connection. Here is a node equivalent, all of the code can be copied over and used in a browser, just remove the node bits, WS is built into browsers [https://github.com/BarryCarlyon/twitch\_misc/tree/main/pubsub](https://github.com/BarryCarlyon/twitch_misc/tree/main/pubsub) TwitchDev itself has a “client side” example here [GitHub - twitchdev/pubsub-javascript-sample](https://github.com/twitchdev/pubsub-javascript-sample) ---
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 26, 2021, 12:14pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/6 "2021-03-26T12:14:36Z")
Hey Barry, sorry for the late of my answer. I will check it out, and see what I can do with it. I don’t know if it’s to much to ask, and if it is I will understand, but for example can you show me how to listen to someone that just follow the channel ? Again, if I ask to much, it’s ok I will search myself 🙂 Thanks for your answer ! 🙂 ---
**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:** [March 26, 2021, 12:16pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/7 "2021-03-26T12:16:10Z")
> [@DuckenScott](#): > > I don’t know if it’s to much to ask, and if it is I will understand, but for example can you show me how to listen to someone that just follow the channel ? There is no Listen you have to continually poll the Followers Endpoint > **[Reference](https://dev.twitch.tv/docs/api/reference/)** > > Twitch Developer tools and services to integrate Twitch into your development or create interactive experience on twitch.tv. And compare the data, you can’t “listen” per sae in Client Side Javascript ---
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 26, 2021, 12:18pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/8 "2021-03-26T12:18:14Z")
Oh okay, so for example I will have to execute like every 5 seconds the call of the URL and watch for every change into the JSON response, is it correct ? Thank you so much for this fast reactivity ! I apreciate that 🙂 ---
**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:** [March 26, 2021, 12:21pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/9 "2021-03-26T12:21:51Z")
> [@DuckenScott](#): > > Oh okay, so for example I will have to execute like every 5 seconds the call of the URL and watch for every change into the JSON response, is it correct ? Every 5 seconds is not a good idea due to caching. For any given endpoint it’s not worth polling quicker than once per minute. For follow notifications (on overlays and the like), most people don’\t bother since it’s just noise. But you could wait until EventSub has a socket Transport which then means you can use EventSub for everything ---
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 26, 2021, 12:31pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/10 "2021-03-26T12:31:38Z")
Mmmmh okay, once per minute is, I think, to long for follow notification. I would like it to be just like the regular notification on Streamlabs you know, when someone follow, it appear approximately 5 or 10 seconds after the user has clicked on the button. And so is there anyway to do the same or it’s impossible ? Just to tell you, I have knowledge in JavaScript just to create website, and maybe I have some lack of knowledge in what you tell me. Maybe I have to learn more about it 🙂 Thanks again, really I truly thank you 😃 ---
**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:** [March 26, 2021, 12:32pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/11 "2021-03-26T12:32:58Z")
> [@DuckenScott](#): > > Mmmmh okay, once per minute is, I think, to long for follow notification. Fetch queue and spread! > [@DuckenScott](#): > > I would like it to be just like the regular notification on Streamlabs you know, when someone follow, it appear approximately 5 or 10 seconds after the user has clicked on the button. And so is there anyway to do the same or it’s impossible ? They use EventSub/Webhooks to recieve into their server, then forward those to overlays via WebSockets. ---
**Author:** ![DuckenScott](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/duckenscott/32/18031_2.png) [@DuckenScott](https://discuss.dev.twitch.com/u/DuckenScott)\ **Post date:** [March 26, 2021, 12:43pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/12 "2021-03-26T12:43:41Z")
Okay thank you so much for those answers, I think I will build my program and I will probably ask you some help if needed 😃 ---
**Author:** ![system](https://d2opxh93rbxzdn.cloudfront.net/original/2X/0/05909729875cce3b53e59d5561c4d23bb14948fc.png) [@system](https://discuss.dev.twitch.com/u/system)\ **Post date:** [April 25, 2021, 12:43pm UTC](https://discuss.dev.twitch.com/t/how-to-get-and-listen-realtime-channel-events-in-javascript/30985/13 "2021-04-25T12:43:43Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.