How does Twitch’s new EventSub work?

Preamble

In the beginning, Twitch created Webhooks. And the world rejoiced, finally we no longer have to long poll for things such as followers! Hurrah! But it came with a gotcha, since Twitch Webhooks is based on the Websub specification, each and every Webhook you wanted to listen to had to be renewed, now this is limited to 10 days (max) or the time remainging on the Token you authenticate with (when asking to listen to priviledge topics such as subscribers), which generally meant you had to remake certain subscriptions every 4 hours, after of course renewing the token with the refresh token. Since the maximum length of a Twitch user token is 4 hours. (Implicit tokens use 60 days, but you can’t refresh those).

This wasn’t a good solution for developers, since it creates siginificant load, and “wasting” of your rate limits with Helix. Even more so when working with multiiple streamers.

Twitch has acknowledged this as a problem, which leads us to the new product of EventSub.

Aside from ignoring the need to remake your subscriptions periodically, EventSub also doesn’t need a correspoding Helix endpoint to exist for the topic you wish to listen on (this also means a different format for the data payloads), and means EventSub can make new topic types without waiting for Helix to create the endpoint first.

So, now onwards to the meat of this post!

EventSub, hows does it work?

The long and short of it, is that everything is sent via HTTP Post requests, to your SSL protected endpoint.

Unlike Webhooks, Eventsub only authenticates using App Access Tokens (for server to server requests), but how does this work when you are attempting subscribe to a channels new Subscribers topic, or the Ban/timeout events topics?

Authentication

Well, when you make a subscription request to EventSub, Twitch looks at your App Access token, then checks in the background if the requested broadcaster has connected to your Application at any point, with the relevant scopes, and not revoked that connection.

So, it’s a “two legged” approach to authentication. But means that you, the developer, don’t need to store the broadcasters access or refresh tokens, after they have authorised. though you generally would in order to perform “catch up” if your application goes offline/restarts for any reason.

Infrastructure

So to utilise EventSub, you need to create a portal that allows broadcasters to grant access to your Application to their account with the relevant scopes, using “regular” User Authentication.

Then on authentication you check/create eventsub subscriptions as needed, using your App Access Token. You should also store and use the returned User Acces token for use on catchups

And you need a server that can recieve HTTP Posts from Twitch for verification of the connection and accepting data payloads. (Generlly here you’ll HTTP 2xx OK as quickly as possible and send the data into background processes.

TLDR: for example if you can call Get Broadcaster Subscriptions (at the moment you obtained the Access Token) then your ClientID can subscribe to the channel.subscribe EventSub.

Summary

Hopefully this should help out anyone that is new to EventSub or getting involved with the Twitch Channel Points Hackathon.

Since many people may look at EventSub to recieve new Channel point redemptions but might trip up over the initial authentication setup.

There are a number of examples on my GitHub that might help, but if you need any further help, please join us on the TwitchDev Discord Server!

Just thought I would write up this post with a ramble of notes on how EventSub Authentication works, since theres gonna be a spike in people asking and probably getting stuck if they are new to working with Twitch.

What is ArtificialNext?

Artificial (Next) is a show on Twitch, it’s currently in it’s third Season! It is an Emmy and Peabody nominated (2020)/winning (2019) show.

Season three is very interesting as due to COVID, as it is all being done remotely, the Actors all stay at their respective homes, and dial in to the central “office” to be “included” in the show. And in in cases, the show runner has not met the new actors/actress for this season!

The premise of the show, is that Dr. Matt Lin, developer of a robot body and AI, aims to “replace” his lost daughter. The show follows the development of that AI.

At the end of Season 2 that AI, guided by Twitch Chat decided to murder someone involved with the program. Season 3 follows on, where the AI has been reset, but the daughter of the person that was “murdered” is seeking vengeance, for want of a a better term! (Please DO check out the official Website and the vods to understand the full story line! This is my understanding and you should make your own!)

For Season 3 I’ve been contracted to design and develop, the user/viewer interaction systems, but HOW does this work?

To put it simply, Artificial is a Full Motion Video Game, where Twitch votes on the direction as a democracy, each possible route is planned out by the writers, and the writers (and actors) respond to the Chat choices, each season “story” (or consequential choices) route is picked by the chat.

I am contracted to design and develop the systems that interact between chat and the show, as smoothly and as transparently as possible. The Extension details can be seen at the Extension page.

You can checkout more about the show and watch the past seasons, on Twitch or on IMDb

ArtificialNext is live at 1 am UK time Friday Mornings, or 5pm PDT Thursday.

Mac, OBS and Streaming Audio Right

OBS has for some time been working on it’s new version of OBS which is called OBS studio, and is cross platform. Finally we are free from having to faff about with WireCast, we can now just plug and play and Stream away. BUT WAIT it’s not just that simple!

If you ever tried Minecraft’s in game streaming it will at least (force) prompt you to download additional required software to get you going.

This software (whilst not needed, (well it’s not but you are a idiot if you don’t setup your audio properly)) will get your Audio going properly on OBS streaming when you are not using additional Hardware.

This piece of software is called Soundflower, and is an example of Virtual Audio Cabling, which basically creates a software based Sound Card inside your computer in order to route audio more usefully!

Installing

So first things first, grab yourself a copy of OBS Studio, you can find the latest version on GitHub here. Download and install!

Next we’ll grab a copy of SoundFlower which is on their site here or GitHub here.

SoundFlower will need you to restart your Computer.

Getting Setup

Lets fire up OBS Studio:

OBS 0.9.1

I’ve got a few extra scenes setup, but this is the layout you’ll be presented with!

We are going to add a source, (first make a scene of course) in this case a “Audio Output Capture”

Audio Selection

And then, to keep things simple, just select the SoundFlower 2 Channel. We don’t need to do anything wacky.

Input Select

Finally we need to change the Sound Settings under System Preferences. So open System Preferences and Sound. And select Soundflower (2ch) as the Output device.

System Prefs Sound

Now suddenly everything will go quiet as all your audio is being sent to OBS/Soundflower: (it’s good to check that OBS is actually detecting at this point)

Audio Monitoring

We need to route the Audio from your computer via Soundflower back to Speakers/headphones. For this open SoundflowerBed:

SoundFlowerBed

It’s under Applications/Soundflower, this fires up a Menu Item in the Top Dock

Top Menu

Just click that, and send the Soundflower (2ch) back to “Built in Output/headphones” And now both you and OBS can hear everything.

Soundflower Routing

Your computer’s audio is now sent to this device and captured by OBS.

(You can tell as my mic here is picking up my speakers):

Preview

And there we go 🙂

BONUS

(Billy May’s Voice) BUT WAIT THERES MORE!

Xbox 360 Controller on Mac under Yosemite?

Unofficial Release 0.14 works fine and it’s on GitHub here

BONUS BONUS

Now what do you do if you get Beachball of Death when trying to use the SoundflowerBed Icon from the menu?

First open Terminal (sorry).
Then type:

ps aux | grep Soundflowerbed.app

Then you’ll see something like this:

SoundflowerBed Hunt

Then type:

kill 9331

Where 9331 is replaced with the number here:

SoundflowerBed Kill

It is VERY important you kill the right thing. As otherwise you might break something and have to restart the whole computer.

Once you have kill’ed SoundflowerBed, just reopen and all should be good.

Further Reading: Some Tips from Tuts+