H2R Graphics v2
  • Return to h2r.graphics
  • What is H2R Graphics?
  • Getting started
  • Launcher
  • Control
    • Rundown
    • Data source
      • YouTube live chat
      • HTTP listener
      • SocialStream.ninja
    • Variables
    • Social
  • Output
    • Output window
  • Graphics
    • Time
    • Map
  • Theme
    • Fonts
    • Colours
    • Custom CSS
  • How to use with
    • ATEM
    • OBS
    • vMix
  • Pro
    • What is Pro?
    • Multiple projects
    • Multiple outputs
    • Pro graphics
  • API
    • HTTP
    • Companion
    • OSC
  • Issue or feedback?
  • Manual backup
Powered by GitBook
On this page
  • Adding this data source
  • Sending data to the HTTP listener
  • Messages array
  • Message explained
  • The end result

Was this helpful?

  1. Control
  2. Data source

HTTP listener

Available from v2.11

PreviousYouTube live chatNextSocialStream.ninja

Last updated 2 years ago

Was this helpful?

The HTTP listener data source allows you to build your own implementation to get data into the social tab of H2R Graphics.

This data source listens for API POST requests and displays the data in a usable way, so that you can then include it on your Social graphics.

Adding this data source

To add the HTTP listener data source, add it from the list.

Sending data to the HTTP listener

When you add a HTTP listener data source, it will be given a unique ID for use in your request.

In this example, UXKIOKQJAA is the ID of this data source.

You'll also find a URL to send data to, again in this example it is http://127.0.0.1:4001/data/UXKIOKQJAA/.

See the full POST request below.

POST http://127.0.0.1:4001/data/UXKIOKQJAA

Headers

Name
Type
Description

content-type

String

application/json

Request Body

Name
Type
Description

messages*

array

Array of messages, see example bellow.

Messages array

Each POST request should contain an array of messages. These must be formatted as follows...

{
    "messages": [
        {
            "id": "ABCD_MUST_BE_UNIQUE",
            "timestamp": "UNIX_TIMESTAMP",
            "snippet": {
                "displayMessage": "Here is my message to you-ou-ou."
            },
            "authorDetails": {
                "displayName": "John Barker",
                "profileImageUrl": "URL to image"
            },
            "platform": {
                "name": "YouTube",
                "logoUrl": "https://img.url.com"
            }
        }
    ]
}

Message explained

id - A unique string to identify the message within the stream of messages.

timestamp - (v2.13) Unix timestamp showing when the message arrived.

snippet.displayMessage - Main text of the message - No HTML allowed.

authorDetails.displayName - Name of the author of the message.

authorDetails.profileImageUrl - URL pointing to the authors image.

platform.name - (v2.13) Platform where the message came from, like YouTube or Twitch.

platform.logoUrl - (v2.13) URL pointing to a logo of the platform.

The end result

When it all goes smooth, you will now see your messages show up on the social tab in H2R Graphics!

Adding the HTTP listener data source
A newly added source
New messages showing up on the social tab