[TRIGGER] Twitch new stream by stream (instant) webhook

[ctrlaltdylan]

Describe the event source. What app is this for, and what event does the trigger correspond to?

The current Twitch sources use polling instead of the webhooks.

A Pipedream user has made a short guide to create a webhook source manually:

https://gitlab.com/community-coders/pairing-sessions/-/blob/main/doc/bot-setup.md

Please investigate if this is possible to create instant sources which would be a huge usability improvment.

Please provide a link to the relevant API docs for the specific service / operation this trigger is tied to.

https://dev.twitch.tv/docs/eventsub

[dylburger]

Thanks for the request! Did you know that anyone can author and publish their own Pipedream sources? Would you be interested in helping out with that? We're happy to answer any questions or support you in any way.

If you don't have the time, would you be willing to reach out to the app provider to see if they're interested in building these? When we work with an app partner, it improves the quality of the integration, and it helps when this kind of request comes from a customer like you.

[dylburger]

We've added this issue to our backlog. You can follow this issue for updates!

[Jordon-L]

Hi, I would like to do this issue. I have a question. I've noticed that there are already files and functions related to webhooks, however, they are using a deprecated API (WebSub). Should I delete the old functions?

[dylburger]

@Jordon-L That's great! Yes, if the API is deprecated and you're modifying all event sources that use the deprecated API, feel free to delete any references to that code as you refactor.

[Jordon-L]

@dylburger Update: I have a working prototype.

Twitch's EventSub, requires an application OAuth Token. Currently, I am manually creating an OAuth Token and passing the token and client id in as a prop. As a result, I am forced to create new functions to use the OAuth Token. Is there a better way to do this?

link to docs

[Jordon-L]

Would it be considered bad practice to ask for both client ID and client secret as props to dynamically generate and renew an OAuth token?

[dylburger]

@Jordon-L Generally we like to ask for that as a part of the app connection process, instead of prompting users each time in props.

We should be generating a fresh OAuth access token when you connect your Twitch account (the Pipedream-provided Twitch app) to a code step, exposed in this.twitch.$auth.oauth_access_token. We should also expose the client ID under this.twitch.$auth. Did you try using those values in the API request to create your webhook? I'm curious if that works.

[Jordon-L]

@dylburger I have tried those it gives a 4xx error code. Don't remember the exact error code. Twitch's Webhooks (Eventsubs) does not allow using a user OAuth token. It requires an application OAuth token, which is generated by using an application client ID and client secret. You can create a twitch application from their dev console.

[Jordon-L]

link to the relevant portion in the docs

[dylburger]

Got it thanks. Did you try using the Twitch Develop App account? That accepts a client ID and secret when you connect your account, and Pipedream should also handle token refresh and expose a fresh token and the client ID via $auth.

Is the app access token different? i.e. is that a static value retrieved from the Twitch Developer console? If so, we could add that as a field that users can enter along with the client ID / secret in the Twitch Developer App connection.

[Jordon-L]

I will try the Twitch Develop app, it seems like what I was looking for. I cannot find the files for them. Do I just code using the pipedream interface?

Yes, the app access token is different from the user access token. The app access token is not a static value. It is generated by calling https://id.twitch.tv/oauth2/token with the app client ID and client secret which is retrieved from the Twitch developer console.

[dylburger]

Got it, thanks. The Twitch Developer App should be configured to generate a token from that endpoint. Try connecting your own client ID / secret via that app and see if that works OK.

I cannot find the files for them. Do I just code using the pipedream interface?

Take a look here - that's where the basic app file and other code lives for the Twitch Developer App, so you can create components from there.

[Jordon-L]

Thanks, Seems like I didn't update to the latest version properly.

[Jordon-L]

@dylburger I got it working with the Twitch Developer app. However, I had to change related files' extensions to .mjs from .ts. I am not familiar with Typescript. I keep getting Could not resolve "../../app/common/common" when I do pd dev <file location> on Pipedream CLI. I still cannot resolve the issue after looking a different typescript component called lob

My current folder structure looks like this:

[Jordon-L]

Update: I have finished, however, the files have .mjs extensions. Does pipedream CLI not work with .ts files?

Note:

1. takes around 1 - 2 minutes from the time I push "start streaming" on OBS for the event to emit on Pipedream.
2. Challenges will be sent by Twitch, which will consume invocations on Pipedream.

[dylburger]

That's great! And yes, you need to compile the TypeScript to .mjs files locally (as noted in the TypeScript quickstart), then pd publish the .mjs files.

You'll notice there's a .gitignore file in the app directory that excludes .mjs files from being added to Git, which is by design. Only the TypeScript code should be committed. Once we merge you code, we automatically compile it to JavaScript and publish the .mjs files to Pipedream.

Let me know if that helps.