khaosdoctor / deno-opengraph

Fetches and parses data from website to get their OpenGraph metadata

Open Graph and Social Media Metadata for Deno

Fetches and parses data from website to get their OpenGraph metadata

Usage

import { getOGTags, getTwitterTags, getMetaTags } from "https://deno.land/x/opengraph/mod.ts";
// also possible with import * as og from './mod.ts'

// Returns a promise that resolves to an object with the OpenGraph metadata
console.log(await getOGTags('https://deno.land'))
// {
//   title: "Deno, The next-generation JavaScript runtime",
//   description: "Deno features improved security, performance, and developer experience compared to its predecessor. "... 65 more characters,
//   image: {
//     content: "https://deno.com/og/image.png",
//     alt: "A logo of a sauropod in the rain and the word Deno"
//   },
//   type: "website",
//   site_name: "Deno",
//   locale: "en_US"
// }

// Returns a promise that resolves to an object with the Twitter metadata
console.log(await getTwitterTags('https://deno.land'))
// {
//   card: "summary_large_image",
//   site: "@deno_land",
//   title: "Deno, The next-generation JavaScript runtime",
//   description: "Deno features improved security, performance, and developer experience compared to its predecessor. "... 65 more characters,
//   image: {
//     content: "https://deno.com/og/image.png",
//     alt: "A logo of a sauropod in the rain and the word Deno"
//   }
// }

// Returns a promise that resolves to an object with all the metatags that have a name or property attribute
console.log(await getMetaTags('https://deno.land'))
// {
//   viewport: "width=device-width, initial-scale=1.0",
//   robots: "index, follow",
//   twitter: {
//     card: "summary_large_image",
//     site: "@deno_land",
//     title: "Deno, The next-generation JavaScript runtime",
//     description: "Deno features improved security, performance, and developer experience compared to its predecessor. "... 65 more characters,
//     image: "A logo of a sauropod in the rain and the word Deno",
//     alt: "A logo of a sauropod in the rain and the word Deno"
//   },
//   og: {
//     title: "Deno, The next-generation JavaScript runtime",
//     description: "Deno features improved security, performance, and developer experience compared to its predecessor. "... 65 more characters,
//     image: "A logo of a sauropod in the rain and the word Deno",
//     alt: "A logo of a sauropod in the rain and the word Deno",
//     type: "website",
//     site_name: "Deno",
//     locale: "en_US"
//   },
//   description: "Deno features improved security, performance, and developer experience compared to its predecessor. "... 65 more characters,
//   keywords: "deno, denoland, development, javascript, typescript, webassembly, wasm"
// }

Usage with parsed HTML

This lib uses deno-dom to parse the HTML, but you can also pass a parsed HTML document to the functions. If you do that, the lib will not fetch the HTML and will only parse the document you passed.

import { getOGTags, getTwitterTags, getMetaTags } from "https://deno.land/x/opengraph/mod.ts";
import { parse } from "https://deno.land/x/deno_dom/deno-dom-wasm.ts";

const html = await fetch('https://deno.land').then(res => res.text());

console.log(await getOGTags(html)) // same result

Limitations

OpenGraph is a long specification with several tags, some of them are nested and this lib will try to parse the nested ones so they form a nice object with all the data. However it does only support two levels of nesting. If you find a website with tags such as og:music:album:disc, the tag will be parsed incorrectly. This support is planned for the future.

OpenGraph also has support for arrays, but this lib does not support them yet.