I have a facebook application. The users are logged in and authorized. I am calling fb.api to post the user's name to my textfile. The alert shows the name. The post doesn't seem to post to my aspx file..
FB.Event.subscribe('edge.remove', function (href, widget) {
alert("outside");
FB.api('/me', function (response) {
alert(response.name);
var paramsObj = { 'name': response.name };
$.post("ajax/delete.aspx", paramsObj);
});
window.location.replace("Default.aspx");
});
I've updated my code to include showing the encapsulating facebook calls to give a broader picture as well as to include #Lix changes [thank you!].
Few things you might want to try :
Define your post parameters object before and only place the objects name in the jQuery $.post method.
Wrap your json keynames with quotes.
var paramsObj = { 'name':response.name};
$.post("ajax/write.aspx", paramsObj );
Use firebug/chrome developers tools to debug the AJAX request and see if any value is being passed and/or use breakpoints in your code to help you understand where the value is missing.
The page was being redirected prior to the api call/ajax post. This is what worked:
FB.Event.subscribe('edge.remove', function (href, widget) {
FB.api('/me', function (response) {
var paramsObj = { 'name': response.name };
$.post("ajax/delete.aspx", paramsObj);
window.location.replace("Default.aspx");
});
});
Related
I am trying to solve the last exercise in the graph academy of facebook developer page, https://developers.facebook.com/graph-academy/graph-api-basics/10/ but when i was asked to:
"GET call using the value from the next field." i cannot get the excersice well done, because i get a full url in the value for paging.next
my code is:
// Graph API Basics
// Lesson 10 - Pagination
// The FBID of the Facebook page is 20531316728 or facebook.
FB.api('/facebook/posts', 'GET', {}, function(response) {
var paging = response.paging;
log(paging);
log(paging.next);
);
FB.api('/facebook/posts', 'GET', {}, function(response) {
});
the last part, FB.api, is my best try, but when i put the value on paging.next is a full url, i have tryied copy the entire url inside the brackets, or replacing responce variable, anyone can give me a hint?
Also i have tried this, it is working on the js sdk console, but it is not the expected result, the green checkmark is not triggered.this is the screenshot
// Graph API Basics
// Lesson 10 - Pagination
// The FBID of the Facebook page is 20531316728 or facebook.
FB.api('/facebook/posts', 'GET', {}, function(response) {
var paging = response.paging;
log(paging);
log(paging.next);
);
FB.api('paging.next', 'GET', {}, function(response) {
});
Why your answer won't work:
FB.api('paging.next', 'GET', {}, function(response) {
});
First of, 'paging.next' is just a string. Secondly it is outside the callback function which is outside the callback scope.
Here's the way I answered it.
FB.api('/facebook/posts', 'GET', {}, function(response) {
var paging = response.paging;
log(paging.next);
FB.api(paging.next); //paging.next object is to be passed to the next api call.
});
I hope this helps.
They just wanted to log first and second pagination object. Try the code below:
FB.api('/facebook/posts', 'GET', {}, function(response1) {
var paging = response1.paging;
log(paging);
FB.api(paging.next, '', {}, function(response2) {
log(response2.paging);
});
});
This question already has an answer here:
Facebook ignoring OG image on first share
(1 answer)
Closed 6 years ago.
First of all hi and thanks in advance to anyone who can help with this because I've been going crazy over this for weeks now.
So I've got a website which lists gif taken from my mobile application (which are then stored on AWS and my visitors ( I haven't found a use for me to have users) can share these gifs on facebook using the facebook sdk.
The problem appears when I try sharing an image for the first time
This is what the share dialog shows the first time I click on my sharing button:
http://i.stack.imgur.com/lNVNF.png
and then I close and reclick the same button and now it works:
http://i.stack.imgur.com/YsDUm.png
Now I've been trying to find a way to make this work on the first sharing attempt but to no avail.
I am using meteor in combination with biasport:facebook-sdk and Amazon S3 for the hosting of my files.
Edit here is the code used:
FRONT SIDE
HTML
<div class="facebook share">
<img src="/gallery/fb.png">
</div>
Javascript
Template.*templateName*.events({
'click .facebook': function(e){
e.preventDefault();
e.stopPropagation();
// this is in a modal so I store the data I need
// (events have photos which in turn contain a url to the gif
var url = Session.get('event').photos[Session.get("id")].url;
FB.ui({
method: 'share',
href: url
});
}
SERVER SIDE
JAVASCRIPT
if(Meteor.isClient) {
window.fbAsyncInit = function() {
FB.init({
appId : 'APP_ID',
status : true,
xfbml : true,
version : 'v2.5'
});
};
}
Edit: I found a manual solution using exec future and curl
so first I added a call to a meteor method on the share that updates the facebook crawler
JAVASCRIPT
Template.*templateName*.events({
'click .facebook': function(e){
e.preventDefault();
e.stopPropagation();
// this is in a modal so I store the data I need
// (events have photos which in turn contain a url to the gif
var url = Session.get('event').photos[Session.get("id")].url;
Meteor.call('updateCrawler', url, function(){
FB.ui({
method: 'share',
href: url
});
});
}
Then I defined my meteor method as such
JAVASCRIPT
Meteor.methods({
updateCrawler: function(url){
var future = new Future();
cmd = 'curl -X POST -F "id=' + url + '" -F "scrape=true" -F "access_token={my_access_token}" "https://graph.facebook.com"';
exec(cmd, function(error){
if (error){
console.log(error);
}
future.return();
});
future.wait();
}
});
it's ugly but since I'd have to wait for the crawler to update and it works I'll leave this here for future use for someone maybe
Edit2:
I did not use og tags at all since I was simply sharing a url to aws directly and not a url to my website
I worked around this problem by calling the Facebook API direct from the server to make it scrape the og data by requesting info on the page. First time round it doesn't have the image cached but second time it does so this workaround does the initial call before sharing.
Use an access token for your facebook app and call the below in an ajax call and await the response before opening share dialog. Replace Google address with your own uri encoded address https://graph.facebook.com/v2.5/?id=http%3A%2F%2Fwww.google.co.uk&access_token=xxxxx
EDIT:
As per comments, here is my server side method for calling this which I use when posts etc are inserted to make the initial call and prompt a scrape from fb:
var getTheOGInfo = function (link)
{
if (!link || link.slice(0, 4).toLowerCase() != "http"){
throw new Meteor.Error("og-info-bad-url", "Function requires an unencoded fully qualified url");
return false;
}
var url = "https://graph.facebook.com/v2.5/{{{{id}}}}?access_token={{{{token}}}}&fields=og_object{id,description,title,type,updated_time,url,image},id,share";
var token = Meteor.settings.private.fb.token;
if (!token){
throw new Meteor.Error("og-info-no-token", "Function requires a facebook token in Meteor.settings.private.fb.token");
return false;
}
var link_id = encodeURIComponent(link);
url = url.replace('{{{{token}}}}', token).replace('{{{{id}}}}', link_id);
var result = HTTP.get(url, {timeout:1000});
return result;
}
Or for your purposes you may not want anything that might be blocking so you could change the last two lines to be aynchronous:
var result = HTTP.get(url, {timeout:1000});
return result;
//Replace with non blocking
HTTP.get(url, {timeout:1000}, function(err, result){console.log('something asynchronous', err, result);});
return true;
I have implemented a pure javascript function for sharing canvas content to an user's facebook wall. The implementation works, but the problem is:
Facebook does not approve the app, stating after review:
"publish_actions on Web - Your app's users must enter all content
in the user message field. Don't auto-populate the message field with
any content, including links and hashtags, even if you allow users to
edit the content before sharing. Watch this informational video for
more information, and see Platform Policy 2.3"
Afaik, there is no way to pass a base64 object through the FB.ui feed share dialogue with client side javascript only.
Question: Any workarounds or other ways go get a client side only canvas -> facebook share implementation that is passed by the Facebook app approval process?
The current implementation is as follows:
document.getElementById('facebook-link').onclick=function(){
FB.login(function (response) {
if (response.authResponse) {
window.authToken = response.authResponse.accessToken;
PostImageToFacebook(window.authToken);
} else {
}
}, {
scope: 'publish_actions'
});
};
function PostImageToFacebook(authToken) {
var imageData = canvas.toDataURL("image/png");
try {
blob = dataURItoBlob(imageData);
}
catch (e)
{
console.log(e);
}
var fd = new FormData();
fd.append("access_token", authToken);
fd.append("source", blob);
try {
$.ajax({
url: "https://graph.facebook.com/me/photos?access_token=" + authToken,
type: "POST",
data: fd,
processData: false,
contentType: false,
cache: false,
success: function (data) {
console.log("success " + data);
},
error: function (shr, status, data) {
alert.log("error " + data + " Status " + shr.status);
},
complete: function () {
console.log("Posted to facebook");
$('#facebook-link').text('Ferdig delt :)').removeClass( "inProgress" );
}
});
} catch (e) {
console.log(e);
}
}
The implementation does not append any text, making me wonder why it does not comply with the Facebook Platform Policy section 2.3.
I had the same problem in an application. Although we have chosen to use the database, I believe it has a solution to your problem.
Really has no way to share a Base64 code by FB.Ui
But as the policies of Facebook, you are not required to use it.
You can create a custom dialog window for the user to view the image that is being posted and enter/confirm the message, and posting after this action.
As the explanatory video from Facebook, the message posted by the user can not be changed, then it should be approved without problems.
I'm trying to use the FB api for login on an app built with angularjs. I'm using the angular-facebook library. It works, but the issue is that once the user authorized the app, the callback is not called. So the popup window is not closed, and the only solution for the user is to reload the page. How can I fix this?
$scope.login = function() {
Facebook.login(function(response) {
// this is never called ;_;
if (response.status == 'connected') {
// I need to do stuff here
}
}, {scope: 'email,user_birthday,user_likes'});
};
IF you want more detail information on how to use AngularJS with FacebookAPI, this might be helpful:
http://www.boynux.com/angularjs-facebook-integration/
Regards,
Based on the angular-facebook documentation shouldn't your code look like this?
$scope.login = function() {
Facebook.login(function(response) {
// Do something with response. Don't forget here you are on Facebook scope so use $scope.$apply
});
};
With the Facebook.login function wrapped within a $scope.login function?
I'm working in a mini-app, which will have 3 pages, and i want all the interaction to happen inside a profile-tab.So, using javascript, i want to show/hide a few divs, which i'll populate using the FBJS ajax object.
My problem is, i'm not getting the user session in the ajax calls.As documentation is extremely confusing, i've ended up not knowing if this is possible at all.Any ideas?
You can get the user's id if you require login from your ajax request on a profile tab. For instance:
var ajax = new Ajax();
ajax.responseType = Ajax.RAW;
ajax.ondone = function(data) {
console.log('done');
console.log(data);
}
ajax.onerror = function(data) {
console.log('error');
console.log(data);
}
ajax.requireLogin = true;
ajax.post('http://DOMAIN/add_story', {story: story});
The requireLogin = true part will cause an authorization window to popup. If they agree, you can get the user ID in your AJAX handler using the PHP SDK, like:
$facebook->getUser();