Increase Feedback in Extensions
After you create a monetized extension, we recommend that you create a feedback loop that enables broadcasters to recognize viewer participation. After all, getting a callout from a streamer is a big reason why viewers subscribe to a stream or cheer with Bits on a stream.
Chat In Extensions
Whenever a special action is completed in an extension, you can post to chat to acknowledge the user and draw more attention to the extension.
First, you need to enable your extension to send chat messages in the Extension Manager, under the Extension Capabilities of your extension’s version. If you do not enable this setting, the request to send a message to chat will result in a 401 error.
To authorize the request, you will need either a backend that can generate a JWT token or the JWT generated by Twitch with the broadcaster role. For details about signing the JWT, see Signing the JWT. With the proper JWT set in the Authorization header, send a request as detailed in the Extensions Reference for Send Extension Chat Message. The message will appear in chat with the extension’s name as the user.
- The message rate limit is 12 messages per minute. Exceeding the limit will cause a 429 error.
- Consider the broadcasters and viewers: since other extensions may also be posting to chat, you should post to it only for major events, such as a sale.
- You can use emotes to make the messages more eye-catching. You can use any emote that the destination channel is subscribed to.
- Remember that your extension’s name will be displayed as its username in chat. If you find that your extension’s name is too long for chat, you can change the name (you need not create a new extension). You can do this in the Extensions Manager, under Settings for your extension.
- You cannot @mention another user in chat.
Animations via Browser Source
You can increase your feedback loop by adding a special animation (custom message or unique graphic) when a user interacts with your extension. To display this on the stream and to have it reflected in the VOD, the broadcaster must implement your animation as a browser source.
Browser sources are implemented on the broadcaster’s software, not on Twitch. This is achieved by loading, on top of the video source, a webpage that plays the animations when prompted.
You must give the broadcaster a link to the webpage you are using for the notifications. The broadcaster must then add this link as a browser source in the streaming software. Any message pushed to that endpoint will be reflected in the broadcaster’s stream.
Browser sources are supported on major broadcasting software such as OBS, OBS.Live, Streamlabs OBS, Xsplit, and Player.me. Xsplit and Player.me refer to a browser source as a Webpage.
- The URL should be uniquely identifiable. A very simple way to ensure this is to use the broadcaster’s Twitch user ID as a unique key - for example, for a user with Twitch ID 1234567: https://my.website.com/extension/1234567.
For further information about translating a Twitch username to a Twitch ID, see the Twitch API Reference.
- The custom URL should be displayed to the broadcaster in the config page of the extension. The broadcaster should be able to locate the URL at any time, in case they lose it after initially configuring the extension.
- Use extra security if the source contains private information. For example, if the user can input private information that can be displayed on stream, add an additional layer of security by generating a unique hash that identifies the user. This would make it hard for the broadcaster’s notifications to be spied on, since a viewer wouldn’t be able to easily guess the URL.
- If there is no alert, the webpage should not display any UI. This page will be active on the broadcaster’s stream, so do not add advertisements or un-triggered callouts.
- If you have a large animation to display, provide recommended window sizes to the broadcaster in the config page where they retrieve the browser source URL.
- Provide a way for the broadcaster to test the alert from either the config panel or live config panel.
- Any further customization such as size, color, or duration are optional, but appreciated.