Clever Geek Handbook

Facebook submit dialog cannot show preview image

I want to use Facebook SendDialog to send a photo to my friend. My app has a lot of photos, if user selects one image, My app will generate HTML, and update the HTML mate tag to:

<meta property="fb:app_id" content="1234567890" />
<meta property="og:type" content="momantest:picture" />
<meta property="og:url" content="myhostdomain.com" />
<meta property="og:title" content="Mytitle" />
<meta property="og:description" content="BlahBlah123!" />
<meta property="og:image" content="The picture use just selected" />

And save this HTML named test1.html and upload it to my server.

and I am using JSSDK:

FB.ui({
       method:'send',
       link : 'https://myhostdomail.com/test1.html'
    });

And SendDialog cannot show the preview image !!!!!

enter image description here

But if test1.html builds five minutes ago, then I use senddialog. The preview screen displays ...

enter image description here

So the problem is that if I create HTML for only a few seconds and use SendDialog the preview image cannot show, but if the HTML is already created 5 minutes ago and uses SendDialog the preview image shows ...

Why? This is mistake?

Is it possible that SendDialog can show a preview image when the HTML was generated just a few seconds ago!

Oh right, I also used debbug tool to check url, response 206, title, decription and image, everything is fine .. But Send Dialog just can't show the preview image

Any answer would be appreciated. Thank!!!!!

+3


source to share


1 answer


If you rewrite the meta tags every time someone wants to submit an image, this won't work as Facebook caches the metadata when the link is first provided.

What you need to do is use unique URLs for each resource so that the data remains intact and unique for that resource. For example:



  • User 1

    wants to share image1.jpg

    . Then create share1.html

    and add the appropriate metadata for this resource.

  • Then when he User 1

    wants to share image2.jpg

    . You create share2.html

    with new metadata and exchange it.

  • If User 2

    wants to share as well image1.jpg

    , you can reuse share1.html

    since the metadata will be the same.

+1


source






More articles:


All Articles