Facebook was failing to parse OG meta tags

Last week was having awful time fighting with strange work of Facebook. We had a page with OG meta tags and a Facebook Like button on the page. And Facebook was discarding to parse the page and extract data from OG meta tags. Using URL linter didn't help to find the problem but show the same information - page isn't parsed, OG meta tags are not used.

So I tried to check next things to find the issue:

  • whether property attribute in used <meta/> tags

  • whether correct fb:app_id meta tag value is set

  • whether nginx returns correct page when facebook requests the page

  • whether correct namespaces added to the <html/> tag

  • whether we are using UTF-8 encoding

  • and something other, don't remember all my tests

And was checking web page through URL Linter each time. With no success. Facebook discarded parsing the page and fetching page title with other data from meta tags.

So I reviewed response/request data through firebug to find suspicious things. I found one scanty detail: Content-Type header had value "text/html;charset=utf-8;charset=UTF-8".
I must say, this one web page is generated by application using user-defined template. Grails controller is responsible for handling request and renders output like:

render text: context.out, contentType: "text/html;charset=$AppConstant.RENDER_CHARSET"

where AppConstant.RENDER_CHARSET equals to "UTF-8". But the rendered page had Content-Type equal to "text/html;charset=utf-8;charset=UTF-8". And my thought was to fix header value to have something like "text/thml;charset=UTF-8" and hoped this may help. So I changed code to be like:

render text: context.out, contentType: "text/html"

Content-Type header value now is "text/html;charset=utf-8". So I tried URL Lint again. I wasn't expecting much from Facebook this time either, but miracle happened! Everything works fine now. I know, that is my fault, but, nevertheless, thank you Facebook for "nice" time spending :).

2 comments:

Adam said...

I think Facebook is just messed up now with embedding. Sometimes the linter works (returns data for each og line and tells you video is enabled) and sometimes it doesn't (returns just your website and domain name) for the same page with the same og:tags.

The news feed is consistent with the linter.


Your fix didn't really apply to my case b/c I had
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

I took out the space next to the semicolon and made utf lower case but it didn't have any effect.

Ruslan Khmelyuk said...

Hi Adam,

I was trying to set content type with <meta/> too, but no result: it doesn't overwrite appropriate HTTP response header.

I was need to check HTTP header Content-Type value and used Chrome Developer Tools or Firebug. That's how I found that HTTP response header was incorrect.