Finding OG Metadata on a Website

Sup y’all. Let’s dive into the world of Open Graph (OG) meta tags and how to extract them using JavaScript console. Here’s a quick copypasta for you to get the OG Metadata on a website without using third party stuff:

Step 1: Open the JavaScript Console

First things first, you need to open your browser’s JavaScript console. If you’re using Chrome, just hit Ctrl + Shift + J (Windows/Linux) or Cmd + Option + J (Mac). If you’re on Firefox, it’s Ctrl + Shift + K (Windows/Linux) or Cmd + Option + K (Mac).

Step 2: Write a Function to Extract OG Meta Tags

Now, let’s write a function to extract all the OG meta tags from the page. Here’s a simple function that does just that:

function getOgMeta() {
  const metaTags = document.getElementsByTagName('meta');
  let ogTags = {};

  for (let i = 0; i < metaTags.length; i++) {
    if (metaTags[i].getAttribute('property') && metaTags[i].getAttribute('property').includes('og:')) {
      ogTags[metaTags[i].getAttribute('property')] = metaTags[i].getAttribute('content');
    }
  }

  return ogTags;
}

Step 3: Log the OG Meta Tags

Now, let’s use console.log to print out all the OG meta tags in a friendly manner:

const ogTags = getOgMeta();
for (let key in ogTags) {
  console.log(`Key: ${key}, Value: ${ogTags[key]}`);
}

And that’s it homies. You’ve just extracted and logged all the OG meta tags from a webpage using the JavaScript console. Keep in mind that not all websites use OG meta tags, so you might not always get results. Happy coding.