3

Video-sharing websites such as Youtube has a endpoint for video thumbnails
Example: http://img.youtube.com/vi/youtube_id/default.jpg
where youtube_id = the id of the video

So I can just do <img src="http://img.youtube.com/vi/youtube_id/default.jpg"> with no problem

Does twitch have something like this as well?

95faf8e76605e973
  • 13,643
  • 3
  • 24
  • 51

1 Answers1

3

Update 2018

Twitch requires you to use its API so you can get access to video thumbnails.
Apparently, this is because the URL of the thumbnails may change

Here is a simple guide how to get access to a twitch video thumbnail

  1. You have to get access to Twitch dev API - to do this you need to register an account at https://glass.twitch.tv

  2. After registering an account you must then create an App from your twitch dev dashboard

  3. After creating the App, you will be given a Client ID to be used for that app - note that the app is the one which will be using the twitch API (for example, your website)

enter image description here

  1. You can now pass the client_id as a query string parameter to https://api.twitch.tv/kraken/videos/106400740?client_id=xxxxxxx where 106400740 is the video id (note that 'kraken' here is constant - not sure of the origin behind its name) - note that the request will return a JSON object which contains an error message if you do not include a client_id

The request will return a JSON object which looks something like:

{
  "title": "Door 5 vs Tilted Gamers",
  "description": "COOL Games: Killing Spree first match @ Mineski. Grove, Los Ba\u00f1os",
  "description_html": "COOL Games: Killing Spree first match @ Mineski. Grove, Los Ba\u00f1os<br>",
  "broadcast_id": 1,
  "broadcast_type": "upload",
  "status": "recorded",
  "language": "en",
  "tag_list": "",
  "views": 4,
  "created_at": "2017-11-08T03:13:12Z",
  "published_at": "2017-11-08T04:33:37Z",
  "url": "https:\/\/www.twitch.tv\/videos\/188543310",
  "_id": "v188543310",
  "recorded_at": "2017-11-08T03:13:12Z",
  "game": "Dota 2",
  "length": 2436,
  "preview": "https:\/\/static-cdn.jtvnw.net\/s3_vods\/esportsdotcool\/188543310\/3534ab8c-bf7d-4c8a-b502-c406825bf75f\/thumb\/index-0000000000-320x240.jpg",
  "animated_preview_url": "https:\/\/vod-storyboards.twitch.tv\/esportsdotcool\/188543310\/3534ab8c-bf7d-4c8a-b502-c406825bf75f\/storyboards\/188543310-strip-0.jpg",
  "thumbnails": [
    {
      "type": "generated",
      "url": "https:\/\/static-cdn.jtvnw.net\/s3_vods\/esportsdotcool\/188543310\/3534ab8c-bf7d-4c8a-b502-c406825bf75f\/thumb\/index-0000000000-320x240.jpg"
    },
    {
      "type": "generated",
      "url": "https:\/\/static-cdn.jtvnw.net\/s3_vods\/esportsdotcool\/188543310\/3534ab8c-bf7d-4c8a-b502-c406825bf75f\/thumb\/index-0000000006-320x240.jpg"
    },
    {
      "type": "generated",
      "url": "https:\/\/static-cdn.jtvnw.net\/s3_vods\/esportsdotcool\/188543310\/3534ab8c-bf7d-4c8a-b502-c406825bf75f\/thumb\/index-0000000012-320x240.jpg"
    },
    {
      "type": "generated",
      "url": "https:\/\/static-cdn.jtvnw.net\/s3_vods\/esportsdotcool\/188543310\/3534ab8c-bf7d-4c8a-b502-c406825bf75f\/thumb\/index-0000000018-320x240.jpg"
    }
  ],
  "fps": {
    "144p30": 29.999544341896,
    "360p30": 29.999544341896,
    "480p30": 29.999544341896
  },
  "resolutions": {
    "144p30": "256x144",
    "360p30": "640x360",
    "480p30": "852x480"
  },
  "channel": {
    "name": "esportsdotcool",
    "display_name": "esportsdotcool"
  },
  "_links": {
    "self": "https:\/\/api.twitch.tv\/kraken\/videos\/v188543310",
    "channel": "https:\/\/api.twitch.tv\/kraken\/channels\/esportsdotcool"
  }
}

Under the thumbnails array you can find the url to the video.

PS: As you can see, the thumbnails array has length of 4 - at this point I think this is because of the different sizes of the image that the author of the video can put up

95faf8e76605e973
  • 13,643
  • 3
  • 24
  • 51