I have a multilingual ember application in which i've included the facebook sdk (async):
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
When the user change the application's language, i would like to change the fb sdk language as well and reparse every fb tag to get everything translated;
I've made a function to set the js.src attribute properly, but the sdk is loaded only when the page refresh, and it happens only on the first load.
How can i reload the sdk with the properly js.src attribute in ember at runtime?
Related
I have the following elements:
a facebook account
an App set up in developers.facebook.com (and added it to my user)
my own website on my server
In my website I implement via Javascript
(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/sdk.js';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
FB.init({
appId: 'XXXXX', // here my App Id
cookie: true,
xfbml: true,
version: 'v2.9'
});
FB.AppEvents.logPageView();
};
That works fine and I can eg make calls like
FB.getLoginStatus(function(r) {
if(r.status === 'connected') {
FB.api('/ZZZZZ/campaigns',function(response) {
// do something!
console.log(response); // (§)
});
}
});
I get the following output at (§):
{"error":{"message":"Unsupported get request. Object with ID 'ZZZZZ' does not exist, cannot be loaded due to missing permissions, or does not support this operation. Please read the Graph API documentation at https://developers.facebook.com/docs/graph-api","type":"GraphMethodException","code":100,“fbtrace_id":“#########"}}
Here XXXX = my App Id, and ZZZZZ = my Business Account Id. They all definitely exist! And as the user that set it all up, my up until that stage logged in user should have all the necessary permissions.
What is going on? How do I make this work?
If you know, please try to provide me concrete code. (All the guides online that I have found are frustratingly vague, which is the reason I am posting this question here.) Thanks in advance!
Further Question: does //connect.facebook.net/.../sdk.js suffice in geneneral to interface with Business Manager via my Api? Or Do I need to download this strange Javascript API SDK und use require, and all that horribly messy stuff?
I want to do is get basic information about a FB Page (total page likes, posts posted by the page). Using the Facebook Javascript SDK I am running into problems.
window.fbAsyncInit = function() {
FB.init({
appId: '12345', //My app id
xfbml: true,
version: 'v2.5'
});
/* make the API call */
FB.api(
"/128155725517",
'GET',
// {"fields":"id,name"},
function(response) {
if (response && !response.error) {
console.log(response);
}
}
);
};
(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'));
And the response I get is:
/**/ FB.__globalCallbacks.f1084b047c({"error":{"message":"An access token is required to request this resource.","type":"OAuthException","code":104,"fbtrace_id":"HUcIot7YeoH"}});
My question is this: Can I request from the Graph API WITHOUT a user access token? Do they have to log in to get an access token for me to read info from the Graph API? Can I create a token that will always work, no matter if the website visitor is logged into FB?
Thanks in advance.
Without login, you can only use an "App Access Token". It is just a combination of App ID and App Secret - but you should never use it in client code, of course. If the Page is restricted by age or location, you need to use a User Token or Page Token.
More information about Tokens and how to generate them:
https://developers.facebook.com/docs/facebook-login/access-tokens
http://www.devils-heaven.com/facebook-access-tokens/
This is the code that I'm using to load the SDK:
window.fbAsyncInit = function() {
FB.init({
appId : "<APP_ID>",
status : true,
cookie : true,
xfbml : true
});
};
(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'));
And this is called when the user clicks the invite button:
function inviteFriends(){
FB.ui(
{
method: 'apprequests',
message: 'invites you to play'
},
function(response){ console.log(response) } // temporary to verify
)
}
The user experience is like described in https://developers.facebook.com/docs/concepts/requests/#ux , but when the receiver logs in the notification disappears after Facebook loading.
Searching for an answer, I found these:
Notification for facebook app requests not showing up
http://facebook.stackoverflow.com/questions/11279765/facebook-pagetab-request-dialogue-notification-shows-and-goes
http://facebook.stackoverflow.com/questions/9689927/ios-fb-request-dialogs-not-working-properly
http://facebook.stackoverflow.com/questions/9812572/facebook-sdk-javascript-request-dialog-disappearing-on-receiver-side
http://facebook.stackoverflow.com/questions/8823362/invite-friends-for-a-website-app-fb-ui-apprequests
http://facebook.stackoverflow.com/questions/10209281/handle-facebook-apprequest-notification
http://facebook.stackoverflow.com/questions/8979826/facebook-notification-from-my-app-appears-and-disappears
But:
sandbox mode is disabled;
the canvas app url is defined, as well as the secure canvas app url;
the app type is defined as Web.
What am I missing?
Facebook was testing what would happen if user-to-user requests did not show up on the notifications jewel. They explain it here:
https://developers.facebook.com/bugs/532388000129311
The test has apparently concluded, and things should go back to normal soon, at least for now.
This still happens when your canvas app is not properly set up. See the answer here:
Facebook notification from my app appears and disappears
I am loading the api like so:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/el_GR/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
I am opening a page through a jQuery UI dialog and reparsing the #comments section with:
<script>FB.XFBML.parse(document.getElementById('comments'));</script>
While on the non-ajax loaded page works fine, when I am opening it from the dialog it gives the error (on the js console):
Permission denied to access property 'fb_xdm_frame_https' # https://s-static.ak.fbcdn.net/rsrc.php/v1/yt/r/Via9RsGlPnX.js:66
and it looks as if it still is loading (the gif keeps playing)
Any ideas?
I think you are not loading javascript sdk properly. Try this code
window.fbAsyncInit = function() {
FB.init({
appId : 'appid', // App ID
channelUrl : 'http://www.url.com', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
Is something like this possible?
I have a client launching an online magazine for his business. He wants to add a facebook like button (for the magazine fanpage) on his current corporate site and ask users to 'like it' in order to be taken to the magazine website. Can it be done? Are there drawbacks to this approach? For example, the same user will have to 'like it' every time they want to access the magazine site?
Thank you for any suggestion, I'm pretty new to facebook.
You can redirect a user on clicking a like button using the Javascript SDK and FB.Event.Subscribe
FB.Event.subscribe('edge.create', function(response) {
window.parent.location = 'http://www.google.com';
});
edge.create is called when ever a user likes something on the page
response is the url that has just been liked.
If there are multiple like buttons on the page you could use an if statement with the response to make sure the page only redirects for a particular like button
Here's the full javascript code and a like button
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
FB.Event.subscribe('edge.create', function(response) {
window.parent.location = 'http://www.google.com';
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/<?php if(isset($fb_user['locale'])){echo $fb_user['locale'];}else{echo'en_US';}?>/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<fb:like href="http://www.google.com" send="false" width="450" show_faces="true"></fb:like>