Facebook以编程方式发布在一张带有大照片的Facebook页面上 [英] facebook programmatically post on a facebook page with a big photo
问题描述
ve创建了一个假Facebook页面(娱乐页面)。
在附加图像的左边,我手动创建了第一个帖子(下面是
大照片),一个以编程方式(上面是小照片)。
I've created a fake facebook page (entertainment page). On the left of the attached image, I made a first post manually (the one below with the big photo), and one programmatically (the one above with the small photo).
我用于小照片的代码如下所示:
The code I used for the small photo looks like this:
FB.api(
'https://graph.facebook.com/[myAppId]/feed',
'post',
{
message: 'this is a grumpy cat',
description: "This cat has been lost for decades now, please call at 654321486",
picture: "http://laughingsquid.com/wp-content/uploads/grumpy-cat.jpg"
},
function (response) {
if (!response) {
alert('Error occurred.');
} else if (response.error) {
document.getElementById('result').innerHTML =
'Error: ' + response.error.message;
} else {
document.getElementById('result').innerHTML =
'<a href=\"https://www.facebook.com/' + response.id + '\">' +
'Story created. ID is ' +
response.id + '</a>';
}
}
);
但我不满意:
我正在做的应用程序一张遗失的动物列表,
,所以大照片会更大。
But I'm not happy with it: the application I'm working on make a list of lost animals, so it would be much greater with big photos.
我没有看到任何在Facebook上如何做的例子开发者页面。
我相信这是可能的,但我还没有找到它。
你们以前是否已经解决了这个问题?
I didn't see any example of how to do it on the facebook developer pages. I believe this is possible, but I've not found it out yet. Have you guys already gone through this problem before?
推荐答案
最后,我做到了!
我发布的解决方案,感谢cdbconcepts指向我正确的方向。
再次阅读文档后:
Finally, I did it! I'm posting the solution, thanks to cdbconcepts for pointing me in the right direction. After reading the doc again:
https://developers.facebook.com/docs/reference/api/photo/
他们说:
你也可以发布通过向照片的URL提供网址参数的照片。
该URL不必在同一个服务器上,如下面的示例
,它可以与js-sdk一起使用。
They say that: "You can also publish a photo by providing a url param with the photo's URL." The url doesn't have to be on the same server, as shown in the example below, and it works with the js-sdk.
所以这里是最适合我的代码:
So here is the final code that works for me:
<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
var appId = 'Replace with your appId';
window.fbAsyncInit = function () {
FB.init({
appId: appId,
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
var options = {
scope: 'manage_pages, publish_stream'
};
FB.Event.subscribe('auth.authResponseChange', function (response) {
if (response.status === 'connected') {
testAPI();
} else if (response.status === 'not_authorized') {
FB.login(function () {
}, options);
} else {
FB.login(function () {
}, options);
}
});
};
// Load the SDK asynchronously
(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));
// Here we run a very simple test of the Graph API after login is successful.
// This testAPI() function is only called in those cases.
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function (response) {
console.log('Good to see you, ' + response.name + '.');
});
}
function error(msg) {
document.getElementById('result').innerHTML = 'Error: ' + msg;
}
function postApi() {
var myPageID = '484364788345193';
var targetPageName = 'Entertainment page of ling';
var pathToImg = 'http://laughingsquid.com/wp-content/uploads/grumpy-cat.jpg';
var accessToken = null;
FB.api(
'https://graph.facebook.com/me/accounts',
function (response) {
if (!response || response.error) {
console.log(response);
error('Error occured');
} else {
console.log(response);
for (var i in response.data) {
if (targetPageName === response.data[i].name) {
accessToken = response.data[i].access_token;
}
}
if (accessToken) {
FB.api(
'https://graph.facebook.com/' + myPageID + '/photos',
'post',
{
url: pathToImg,
access_token: accessToken,
message: "Tadaam"
},
function (response) {
if (!response || response.error) {
console.log(response);
error('Error occured');
} else {
console.log(response);
alert("PostId: " + response.id);
}
}
);
}
else {
error("Page not found in the accounts: " + targetPageName);
}
}
}
);
}
function logout() {
FB.logout();
}
$(document).ready(function () {
$("#logout").click(function () {
logout();
});
$("#post1").click(function () {
postApi();
});
});
</script>
<!--
Below we include the Login Button social plugin. This button uses the JavaScript SDK to
present a graphical Login button that triggers the FB.login() function when clicked. -->
<fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button>
<button id="logout">Logout</button>
<button id="post1">post something</button>
<div id="result"></div>
</body>
</html>
这篇关于Facebook以编程方式发布在一张带有大照片的Facebook页面上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!