"The 'og:type' property is required, but not present." error

Question

I'm having an issue with Facebook's graph API. I'm getting a "The 'og:type' property is required, but not present." error on this URL: http://thatnewjoint.com/posts/logic-driving-ms-daisy-feat-childish-gambino (and every other URL on my blog).

The og:type meta tag is in the HTML so i'm not sure why Facebook isn't recognizing it. Here's what their graph api call is returning:

{
   "id": "561280430667026",
   "created_time": "2014-08-28T20:35:18+0000",
   "is_scraped": false,
   "type": "website",
   "updated_time": "2014-08-28T20:35:18+0000",
   "url": "http://thatnewjoint.com/posts/eminem-superman-throwback-thursdays"
}

seems like when i'm posting using their api (via the koala ruby gem), the link doesn't get scraped? i would assume that the og:type error is causing this but here are the meta tags from that page:

<meta property="og:url" content="http://thatnewjoint.com/posts/eminem-superman-throwback-thursdays" />
<meta property="og:title" content="Eminem - &quot;Superman&quot; [Throwback Thursdays] | ThatNewJoint | Premier Hip Hop Blog" />
<meta property="og:description" content="Classic from The Eminem Show. I&#39;ll be honest - the video is very strange, but the song is great."
<meta property="og:type" content="video">
<meta property="og:image" content="http://i3.ytimg.com/vi/8kYkciD9VjU/hqdefault.jpg" />
<meta property="og:video" content="http://www.youtube.com/v/8kYkciD9VjU?version=3&amp;autohide=1">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="1920">
<meta property="og:video:height" content="1080">

EDITING WITH MORE INFO:

Seems as though if I put the URL into the FB Debugger, I initially get this "The 'og:type' property is required, but not present." error BUT if I then click the "Fetch new scrape information" button, it will find all the correct information like it should. Is it possible that FB is attempting to scrape the URL too early? Seems like on their first pass, they just aren't scraping the URL properly, but I can't figure out why.

Warms

That seems to be fixed now; however you will have to add a secure URL for your video as well, otherwise it’ll not play in newsfeed. – Cowrie

@Warms did you try implementing my Answer below? It was required for my website FB Like button. That is in order to get an individual myWebsite - "Like" to register as a corresponding myFacebook site - "Like". Please let me know. – Wooden

@Wooden thanks for your comment. I realized that I was initializing the FB SDK incorrectly. I fixed it (based on your comments and the new FB JS SDK documentation) but the link still isn't being scraped properly. See this post I just made: thatnewjoint.com/posts/t-i-don-t-tell-em-remix – Warms

@Warms I see you used this FB App ID "174528659300113" not "561280430667026" I would assume that's correct but just checking? Also once your code is set up be sure in FB Developers Dashboard to take your Application out of "Developers Mode" and put it in "Public" Mode. – Wooden

@Warms You have the same FB App ID "174528659300113" for both video pages (Eminem and T.I.) I believe you need a unique App ID for each separate page. I clicked your "Like" button on T.I. and it seems to register the count correctly. Please give feedback! – Wooden

@Wooden why would i need a unique App ID for each separate page? are you saying i need to create a new app for each page? – Warms

@Warms I'm almost certain because, while logged into FB go here developers.facebook.com/apps click your "App ID" then go to "Settings" and in "Website" you will see FB requires a unique Site URL. This is so your user statistics can be tracked properly. It's worth a try. – Wooden

@Warms it looks like its working from my end. If so, what was the final fix? I noticed you added "<meta property="fb:admins" content="1239476" />" Please let me know. – Wooden

@Wooden nope. no luck just yet. posted to a facebook developers group. will report back if i get any answers – Warms

@Warms when I scrape developers.facebook.com/tools/debug/og/object I do not get any errors on this video thatnewjoint.com/posts/t-i-don-t-tell-em-remix – Wooden

@Warms Also I posted a video like comment to my Facebook wall/account to test it and it posted just fine on my personal wall. I think you are up and running. – Wooden

Answer 1

You will need to add this HTML meta tag to your HEAD, with your-app-id (unique Facebook App ID). Just be sure to swap out "your-app-id":

<meta property="fb:app_id" content="your-app-id">

To create a FB App ID go here: https://developers.facebook.com/apps

And add your same unique Facebook App ID to the Facebook JS and place it as close to the top of your HTML body tag as you can. Just be sure to swap out "your-app-id":

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '{your-app-id}',
      xfbml      : true,
      version    : 'v2.0'
    });
  };

  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>

Also to place your website Facebook button add this code as well. Just be sure to swap out "your-unique-page-to-be-liked":

<div class="fb-like" data-href="your-unique-page-to-be-liked" data-layout="button_count" data-action="like" data-show-faces="true" data-share="false"></div>

Finally in Facebook Developers Dashboard take your FB Application out of "Developers Mode" and put it in "Public" Mode.

For more info about FB Open Graph and meta tags here are 2 helpful links: 1. https://developers.facebook.com/docs/opengraph/using-objects 2. https://developers.facebook.com/docs/sharing/best-practices

That should do the trick. Let me know if you need any more help.

I updated this answer, thanks to kitdesai for pointing out that Facebook has new requirements for their Graph API Version which is currently up to v2.1

Wooden

Answer 2

I had this same issue and my problem was that the URL I had set for og:url had a '/' at the end and url of page I posted on facebook did not.

The debugger just told me the og:type was not set yet it was. I believe the issue was that facebook's parser treated the mismatch as a redirect and got confused.

Anyway, making them match fixed my issue.

Insight