Matt Cowley
Matt Cowley

Reputation: 2373

How to get emotes for YouTube live chat messages?

I've been playing around with the YouTube live chat API to look render a YouTube live stream chat, but I'm stuck on how to handle emotes.

The YouTube API for live chat messages seems to only ever return the message in plain text, not metadata about emotes. This itself is fine, as there is standard syntax for emotes within the plain text, but I'm struggling with how to convert those into images.

If I look at the response I get from the YouTube API, I can see no information about the emotes beyond what is in the plain text message:

{
  "kind": "youtube#liveChatMessage",
  "etag": "UaRmhczzavJeCA9S1_s8J_4MHD0",
  "id": "LCC.CjgKDQoLd1VwYUIzYTdkVW8qJwoYVUNEWExPVjNTMEdUd21EOFY4R1A2dzlREgt3VXBhQjNhN2RVbxJFChpDT25vOHN6SW92VUNGZUFJMWdBZE85b1BfZxInQ1BhdG12UEhvdlVDRlhzNFRBb2RVSE1BeVExNjQxNjU5MDY5OTU3",
  "snippet": {
    "type": "textMessageEvent",
    "liveChatId": "Cg0KC3dVcGFCM2E3ZFVvKicKGFVDRFhMT1YzUzBHVHdtRDhWOEdQNnc5URILd1VwYUIzYTdkVW8",
    "authorChannelId": "UC_MMOdc84fer50_SIPiPX1Q",
    "publishedAt": "2022-01-08T16:24:28.363Z",
    "hasDisplayContent": true,
    "displayMessage": ":yougotthis::elbowcough:",
    "textMessageDetails": {
      "messageText": ":yougotthis::elbowcough:"
    }
  },
  "authorDetails": {
    "channelId": "UC_MMOdc84fer50_SIPiPX1Q",
    "channelUrl": "http://www.youtube.com/channel/UC_MMOdc84fer50_SIPiPX1Q",
    "displayName": "Blake Nolan",
    "profileImageUrl": "https://yt3.ggpht.com/ytc/AKedOLSVNcUaOuoH49GXdG1Zlam0uBMJYJXUI5h_pHtMr-rOVr5hDnjzspewBUVqgKyw=s88-c-k-c0x00ffffff-no-rj",
    "isVerified": false,
    "isChatOwner": false,
    "isChatSponsor": false,
    "isChatModerator": false
  }
}

But if I look at how this message shows up in YouTube chat, the emotes are rendered:

YouTube chat screenshot with emotes

What am I missing to perform this lookup and conversion myself so that I can render the emotes from the chat messages?

Cheers.

Upvotes: 1

Views: 2334

Answers (2)

Wito
Wito

Reputation: 55

I am trying to do the same to get emotes inside custom twitch + youtube chat widget for streamelements so I went a route of trying to find the emotes in the network requests on the chat... I found them but...

The whole thing is only included within script tag in the returned HTML of the chat popout and saved into window["ytInitialData"] object and is accessible by window["ytInitialData"].contents.liveChatRenderer.emojis. This object contains an array of all emotes shown in the emote-picker (that includes channel-unique emotes)

So as long as you find a way to fetch the correct channels chat, parse it, and get the content of the script that has window["ytInitialData"] you should be able to do what you need (I have not reached this point yet I will update this after I do so, mostly leaving it here in case someone has a smart way to do this or can make this work before me).

Upvotes: 1

Benjamin Loison
Benjamin Loison

Reputation: 5642

To complete my answer from your other question on this precise question:

By running step 1. you'll get live messages sent in HTML format before your request with emotes in the format :emote: but then come the URL of the emote image.

By running all steps, you'll get live messages sent in real time in JSON format, in the same way you'll get live chat messages with emotes in the format :emote: but then come the URL of the emote image.

I let you understand both HTML and JSON format.

Note: I also found while reverse-engineering the URLs https://www.gstatic.com/youtube/img/emojis/emojis-svg-N.json with N between 0 and 8, that return a bunch of emotes codes linked to their image URL however some emotes like both you stated aren't in these files I don't know why.

Upvotes: 0

Related Questions