Here is the basic I am using FB.ui to post a flash application to the wall of a facebook user. More exactly allowing the user to post the flash application to one of his/her selected friend’s wall.
The flash is posted and works fine in Chrome, FF, Safari and in IE9 with http… but with https it does not work in FF.
The problem ofcourse being I have to make it work on all major browsers and with https.
In the code you can see I am posting the flash application with https protocol, this is because this is how i got it to work under facebook secure browsing, all other links use http protocol.
strFlashVars contains some numbers, strings and parts of url to images
Here is the code (simplified):
FB.ui({
method: 'stream.publish',
to: strUserIdOfSelectedFriend,
attachment: {
name: strName,
caption: strCaption,
description: strDescription,
href: strURLOfThePageThatHasTheMetaData,
media: [{
type: 'flash',
swfsrc: 'https://mysite.com/flashSrc.swf?' + strFlashVars,
imgsrc: strLinkToImage
}]
},
actions: {
name: 'Share',
link: 'http://www.facebook.com/share.php?u=' + encodeURIComponent(strURLOfThePageThatHasTheMetaData)
}
}, function(response){doSometing(response);});
And these are the meta tags that I use on the page that has the flash embedded within it:
<meta property="fb:app_id" content="${strFacebookAppId}" />
<meta property="og:title" content="${strPostTitle}" />
<meta property="og:description" content="${strDescription}" />
<meta property="og:type" content="video" />
<meta property="og:image" content="http:${strImgLink}" />
<meta property="og:video" content="http:${strFlashUrlSource}?${strFlashVars}"/>
<meta property="og:video:secure_url" content="https:${strFlashUrlSource}?${strFlashVars}"/>
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="398" />
<meta property="og:video:height" content="210" />
<meta property="og:site_name" content="${strPageTitle}" />
Now the problem with the stuff above is that the flash application will not load in IE7, IE8 and in Opera at all (the picture and the play button is there, butt when clicked it only stretches out and that’s all it will do) and it won’t work in FF when I use FB with secure browsing on.
I have also tried with the folowing code (simplified):
FB.ui({
method: 'feed',
to: strUserIdOfSelectedFriend,
link: strURLOfThePageThatHasTheMetaData,
actions: {
name: 'Share',
link: 'http://www.facebook.com/share.php?u=' + encodeURIComponent(strURLOfThePageThatHasTheMetaData)
}
}, function(response){doSometing(response);});
This way I let FB to collect the required data from the link (http), and it works in IE7 and IE8 … but it will not work with https on any browser… after that I tried to switch the link’s protocol to https but I recived the same result.
I welcome any suggestions, and will try to answer any question as fast as I can.
PS I also tried
FB.ui({
method: 'feed',
to: strUserIdOfSelectedFriend,
link: strURLOfThePageThatHasTheMetaData,
name: strName,
caption: strCaption,
description: strDescription,
source: 'https://mysite.com/flashSrc.swf?' + strFlashVars,
picture: strLinkToImage,
actions: {
name: 'Share',
link: 'http://www.facebook.com/share.php?u=' + encodeURIComponent(strURLOfThePageThatHasTheMetaData)
}
}, function(response){doSometing(response);});
But with this there was no picture or play button… I found one doccument that tells me to do it this way and another that tells me if I use both source and picture, picture will be ignored.
So the problem was as it turns out after hours of confusion. If you have an SSL certificate that is accepted by IE9, Chrome and Safari it dose not meen that the other browsers will accept it. So basicly the certificate caused the problem.
What i finde interesting that altough FF did not accept the cerificate it was still able to work in http.