In the "Adding Messenger Extensions" guide posted below, window.extAsyncInit() is NOT FIRING after the Messenger Extensions JS SDK is done loading
1) domain is whitelisted
2) I am performing res.sendFile with a bare bones html file:
<!DOCTYPE html>
<html>
<body>
<script>
(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.com/en_US/messenger.Extensions.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'Messenger'));
window.extAsyncInit = function() {
// the Messenger Extensions JS SDK is done loading
alert("This alert isnt being executed in webview or chrome
mobile");
MessengerExtensions.getUserID(function success(uids) {
// User ID was successfully obtained.
var psid = uids.psid;
}, function error(err, errorMessage) {
// Error handling code
});
};
</script>
<h1>
Basic Text
</h1>
</body>
</html>'
3) I am accessing via persistent menu button with messenger_extensions parameter is set to true.
4) The weird behavior I am seeing with my iphone 6:
A. In webview, the alert never comes up
B. On mobile browser, the alert comes up in Safari but not Chrome
C. If I press "Request Desktop Site" while in Chrome mobile , the alert pops up
D. On my Mac (Sierra), the alert pops up in Safari and Chrome
https://developers.facebook.com/docs/messenger-platform/webview/extensions
Related
I was just about to test something so I made 2 buttons with 2 links:
1.) using the facebook sharer.php functionality which works fine
2.) triggering the send ui using the URL redirect I took from the FB developers homepage:
http://www.facebook.com/dialog/send?app_id=123050457758183&link=http://www.nytimes.com/2011/06/15/arts/people-argue-just-to-win-scholars-assert.html&redirect_uri=https://www.bancsabadell.com/cs/Satellite/SabAtl/
I replaced the app id and both links with my own. My app is set up so it point to the links, since I know I had it running once before, where that was the problem.
Now as said the share button works perfectly fine but when I click one the other button I just see a white screen. The URL is in the address bar. Firebug shows no console errors and an empty head and body tag.
Any suggestions?
Thanks,
Gerd
UPDATE: I also implemented the regular javascript ui.send method. The window popsup. I am connected with facebook as the ssl seal shows but again nothing but white.
As far as the URL is concerned the URL is fine it is just a matter of time until Facebook allows to share a URL it has not indexed before. When I changed the link to my main domain instead of subfolder it worked.
As far as the JS SDK is concerned I forgot to check whether the user is logged in or not so this is how it works:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YourId',
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>
<button onclick="sendFb()">Recommend JS</button>
<script type="text/javascript">
function sendFb(){
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
FB.ui({
method: 'send',
link: 'yourlink.com',
});
}
else {
FB.login(function(response) {
if (response.authResponse) {
FB.ui({
method: 'send',
link: 'yourlink.com',
});
}
else
alert('Not Authenticated!');
});
}
});
}
</script>
</body>
</html>
I have used the Social Plugin in the past to place an HTML newsfeed on a website. I'm trying to do the same thing, but I'm not getting the feed to display. In fact, if I visit https://developers.facebook.com/docs/plugins/activity the demo is not displaying. Could this be something with my browser, or a bug in the plugin? Any guidance is much appreciated!!
I have this immediately after the body tag, and I have the html pasted in it's proper place.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'YOUR_APP_ID', // App ID from the app dashboard
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(function(){
// If we've already installed the SDK, we're done
if (document.getElementById('facebook-jssdk')) {return;}
// Get the first script element, which we'll use to find the parent node
var firstScriptElement = document.getElementsByTagName('script')[0];
// Create a new script element and set its id
var facebookJS = document.createElement('script');
facebookJS.id = 'facebook-jssdk';
// Set the new script's source to the source of the Facebook JS SDK
facebookJS.src = '//connect.facebook.net/en_US/all.js';
// Insert the Facebook JS SDK into the DOM
firstScriptElement.parentNode.insertBefore(facebookJS, firstScriptElement);
}());
</script>
<script>(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/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
I am new to developing websites with Facebook SDK. So please bear with me.
Below is my simple code for verifying that I am logged into Facebook.
For some reason I always get the 'not_autherized' response, even though I am the only developer of my app. The app number I provide is correct.
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : 'censored app id', // App ID from the app dashboard
status : true, // Check Facebook Login status
cookies : true,
xfbml : true // Look for social plugins on the page
});
FB.getLoginStatus(checkLoginStatus);
function checkLoginStatus(response) {
if (response && response == 'connected') {
alert('User is authorized!');
} else {
alert('User not authorized!!!');
}
};
// Additional initialization code such as adding Event Listeners goes here
};
// Load the SDK asynchronously
(function(d, s, id) {
if (d.getElementById(id)) return;
var js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js";
var fjs = d.getElementsByTagName(s)[0];
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
</body>
</html>
Is there anything I have overlooked?
Much appreciated :)
A friend helped me with this. He very helpfully pointed out something that Facebook has neglected to document.
When you create a new facebook application, then it is NOT automatically authorized by the admin and developers. An authorized application is one that exists in the "Account Settings->Apps" list. If it is not in this list, then it is not authorized.
This means that you need to call FB.login() at some point in your code in order to popup the user authorization window.
Mind you, this should be called from a button. Otherwise, the popup could be blocked.
Hope this helps someone else but me.
Cheers :)
i just want to ask, i have a Facebook tab , which opens a small website like an frame in this tab , how can i add a link to the tab for a specific page in the frame "" lets say for example tab frame have 3 pages "home , about us , contact us" how can i add a share button which redirect me to this tab and i find contact us opened.
knowing that using static frame app .
and this is my code
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '535262793177723', // App ID from the app dashboard
channelUrl : 'http://bridgestone.thesocialclinic-server.com/', // Channel file for x-domain comms
status : true, // Check Facebook Login status
xfbml : true // Look for social plugins on the page
});
FB.Canvas.scrollTo(0,0); };
// Load the SDK asynchronously
(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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function mohammad(){FB.Canvas.scrollTo(0,0);}
</script>
<script type="text/javascript">
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
</script>
<iframe src="http://bridgestone.thesocialclinic-server.com" scrolling="no" style="border:none;" width="100%" height="2000" onload="mohammad()"></iframe>
You would need app_data URL parameter, and use a link such as http://www.facebook.com/[page_name]/?sk=app_[app_id]&app_data=[specific_page]
Where app_data will be in the 'signed_request'. So you set app_data=page3, and check the parsed signed request value of app_data, and perform a redirect within your app.
After A lot of testing and checking , the result was that i was using static HTML application to add a new tab and get some benefit from fan gate etc...
but that was the problem , after creating the tab in the normal way without any application it worked like a charm.
thank you cdbconcepts for your help .
i've been trying to implement the facebook comments-count feature on my website (using html and C#).
it's a dynamic page, created from the code behind like so:
tmpGuides = tmpGuides + "<img src=\"images/comments.gif\" alt=\"\" style=\"vertical-align: baseline;\" />" + "<fb:comments-count href=http://www.someexamplesite.com/article.aspx?=1909/> </fb:comments-count> ";
it always shows 0 instead of the real amount of comments.
i'm working from my local machine now, but i tried uploading the code to production and it still doesn't work. I also tried url encoding the address.
You do seem to have the right syntax. Are you sure there are definitely comments on the url you are using?
Following the documentation on facebook, under the heading "How do I access the number of comments left of my page?", you can see the code below works for "example.com":
<div id="fb-root"></div>
<script>
(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_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<fb:comments-count href="http://example.com/"></fb:comments-count> awesome comments
If you can get try get it working for example.com then you know that you don't have a problem with your code and it is more likely that there are no comments on the url you are specifying.