HomeThe ClassicsFarai's Codelab

Use Noembed to Get Metadata For YouTube Videos, Tweets and Other Websites

Published:

I once tried to make a web app which extracts RSS feeds from YouTube URLs. One thing I couldn’t do was get channel information from a YouTube video without using the API. Thankfully I discovered Noembed which provides metadata you can use to make embeds.

So we can take some random YouTube video, prepend http://noembed.com/embed?url= to make something like http://noembed.com/embed?url=https://www.youtube.com/watch?v=dQw4w9WgXcQ and we get this:

{
  "thumbnail_height": 360,
  "version": "1.0",
  "url": "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
  "thumbnail_width": 480,
  "width": 200,
  "provider_name": "YouTube",
  "height": 113,
  "provider_url": "https://www.youtube.com/",
  "type": "video",
  "html": "<iframe width=\"200\" height=\"113\" src=\"https://www.youtube.com/embed/dQw4w9WgXcQ?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen title=\"Rick Astley - Never Gonna Give You Up (Official Music Video)\"></iframe>",
  "author_url": "https://www.youtube.com/c/RickastleyCoUkOfficial",
  "author_name": "Rick Astley",
  "thumbnail_url": "https://i.ytimg.com/vi/dQw4w9WgXcQ/hqdefault.jpg",
  "title": "Rick Astley - Never Gonna Give You Up (Official Music Video)"
}

Likewise we can take an iconic tweet (though I wouldn’t trust ti these days) and get this in return:

{
  "width": 550,
  "provider_name": "Twitter",
  "author_url": "https://twitter.com/jack",
  "author_name": "jack",
  "title": "https://twitter.com/jack/status/20?lang=en",
  "type": "rich",
  "provider_url": "https://twitter.com",
  "height": null,
  "html": "<blockquote class=\"twitter-tweet\"><p lang=\"en\" dir=\"ltr\">just setting up my twttr</p>&mdash; jack (@jack) <a href=\"https://twitter.com/jack/status/20?ref_src=twsrc%5Etfw\">March 21, 2006</a></blockquote>\n<script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n",
  "cache_age": "3153600000",
  "url": "https://twitter.com/jack/status/20",
  "version": "1.0"
}

The project was meant to cover sites which don’t use oEmbed but should. I want to use this to make embeds on my site, but I need to figure out how to cache the results in case the underlying resource vanishes.