在网站上实现Facebook页面的提要

时间:2014-07-17 20:25:47

标签: facebook-graph-api

我必须在主页上实现Facebook Feed(我们在Facebook的网站页面)。

我尝试使用此插件(https://developers.facebook.com/docs/plugins/like-box-for-pages),但我无法更改显示样式。例如,我不想在Feed中显示徽标,页面标题和图片。

图表API + JSON + jQuery似乎是在添加网站之前获取和自定义Facebook Feed的方法。附上图像以了解如何显示Feed。

我浏览了Facebook的API页面。但是,如果有人已经这样做,我需要一些指导。

Enter image description here


我使用以下内容获取Feed。

  $(document).ready(function () {                      
        $.ajax({
            url: 'https://graph.facebook.com/1234/feed?access_token=cxcx&callback=?', //Replace with your own access token
            dataType: 'json',
            success: displayFacebookFeed,
            error:alertError
        });
    });

它工作正常,但我正在访问的邮件中有链接,这些链接是文本。

 var html="";
        $.each(result.data, function (i, item) {

            var body = item.message;
            if (!body) {
                body =  item.description;
            }
            html += "<li>" + body + "</li>";

        });

举个例子。

9 Sensational Traits of Highly Promotable Employees | Inc.com http://ow.ly/zN56U

在上面的Feed中,我希望(http://ow.ly/zN56U)作为链接,但它以纯文字形式出现。

有什么建议吗?

4 个答案:

答案 0 :(得分:1)

使用活动源插件,您的域的活动源如何?

https://developers.facebook.com/docs/plugins/activity

答案 1 :(得分:1)

这是我在一段时间内为项目提出的解决方案。绝对不是即插即用,因为它与我的javascript架构集成,但希望能让你开始:

"use strict";
var Facebook = function(sb, options) {
    options = options || {};
    var language = options.language || "en_US";
    var self = this;

    var access_token = encodeURIComponent(YOUR ACCESS TOKEN);

    var listenerQueue = [];
    var loading = false;
    var FACEBOOK;
    var appId = YOUR APP ID;

    if (window.FB) {
        FACEBOOK = window.FB;
    }

    (function _load() {
        if (!loading) {
            loading = true;

            window.fbAsyncInit = function() {
                // init the FB JS SDK
                FACEBOOK = window.FB;
                FACEBOOK.init({
                    appId      : appId,
                    status     : true,
                    oauth      : true,
                    cookie     : true,
                    xfbml      : true
                });

                sb.publish("facebook:initialized");
            };

            // 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/" + language + "/all.js";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));
        }
    })();

    (function() {
        sb.subscribe('facebook:initialized', function() {
            listenForLogin();
            if (listenerQueue.length) {
                clearListenerQueue();
            }
        });
    })();

    function listenForLogin() {
        FACEBOOK.Event.subscribe('auth.authResponseChange', function(response) {
            if (response.status === 'connected') {
                getLoggedInUserData();
            } else {
            }
        });
    }

    function getLoggedInUserData() {
        FACEBOOK.api('/me', function(response) {
            sb.publish('facebook:loggedIn', response);
        });
    }

    function clearListenerQueue() {
        if (FACEBOOK) {
            for (var i=0; i<listenerQueue.length; i++) {
                listenerQueue[i].fn.apply(this, listenerQueue[i].args);
            }

            listenerQueue = [];
        }
    }

    function sharePage(url, options) {
        var opts = options || {};

        if (FACEBOOK) {
            FACEBOOK.ui(
                {
                    method: 'feed',
                    name: opts.name || '',
                    caption: opts.caption || '',
                    description: opts.description || '',
                    link: url,
                    picture: opts.picture || ''
                },
                function(response) {
                    var success = (response && response.post_id);

                    sb.publish('facebook:shared', {response : response, success : success});
                }
            );
        } else {
            listenerQueue.push({fn : sharePage, args : [url, options]});
        }

        return self;
    }

    function getPosts(fbHandleOrId, options) {
        options = options || {};
        if (FACEBOOK) {
            var limit = options.limit || '10';
            var graphPOSTS = '/' + fbHandleOrId +'/posts/?date_format=U&access_token=' + access_token + "&limit=" + limit;
            FACEBOOK.api(graphPOSTS, function(response) {
                sb.publish('facebook:gotPosts', {response : response, handleUsed : fbHandleOrId});
            });
        }  else {
            listenerQueue.push({fn : getPosts, args : [fbHandleOrId, options]});
        }
    }

    function getStatuses(fbHandleOrId, options) {
        options = options || {};

        if (FACEBOOK) {
            var limit = options.limit || '10';
            var graphStatuses = '/' + fbHandleOrId + "/feed/?access_token=" + access_token + "&limit=" + limit;
            FACEBOOK.api(graphStatuses, function(response) {
                sb.publish('facebook:gotStatuses', {response : response, handleUsed: fbHandleOrId});
            });
        } else {
            listenerQueue.push({fn : getStatuses, args : [fbHandleOrId, options]});
        }
    }

    function getNextPageOfPosts(nextPostsUrl, options) {
        options = options || {};

        if (FACEBOOK) {
            FACEBOOK.api(nextPostsUrl, function(response) {
                sb.publish('facebook:gotNextPosts', {response : response, handleUsed : fbHandleOrId});
            });
        } else {
            listenerQueue.push({fn : getNextPageOfPosts, args : [nextPostsUrl, options]});
        }
    }

    function getPublicUserInfo(fbHandleOrId, options) {
        options = options || {};

        var graphUSER  = '/'+ fbHandleOrId +'/?fields=name,picture&callback=?';

        if (FACEBOOK) {
            FACEBOOK.api(graphUSER, function(response) {
                var returnObj = {response : response, handleUsed : fbHandleOrId};
                sb.publish('facebook:gotPublicUserInfo', returnObj);
            });
        } else {
            listenerQueue.push({fn : getPublicUserInfo, args : [fbHandleOrId, options]});
        }
    }

    function getLikes(pageHandle, options) {
        options = options   || {};

        var graphLIKES = '/' + pageHandle + '/?fields=likes';

        if (FACEBOOK) {
            FACEBOOK.api(graphLIKES, function(response) {
                var returnObj = {response : response, handleUsed: pageHandle};

                sb.publish('facebook:gotLikes', returnObj);
            });
        } else {
            listenerQueue.push({fn : getLikes, args : [pageHandle, options]});
        }
    }

    function login() {
        if (FACEBOOK) {

            FACEBOOK.getLoginStatus(function(response) {
                if (response.status !== "connected") {
                    // not logged in
                    FACEBOOK.login(function() {}, {scope : 'email'});
                } else {
                    getLoggedInUserData();
                }
            });
        } else {
            listenerQueue.push({fn : login, args : []});
        }

    }

    function getNextPageOfPosts(callback) {
        callback = callback || function() {};


    }

    return {
        getLikes : getLikes,
        getPublicUserInfo : getPublicUserInfo,
        getCurrentUser : getLoggedInUserData,
        getNextPageOfPosts : getNextPageOfPosts,
        getPosts : getPosts,
        getStatuses : getStatuses,
        sharePage : sharePage,
        login : login
    }
};

答案 2 :(得分:1)

Facebook现在刚刚补充说;

注意:随着Graph API v2.3的发布,不推荐使用Activity Feed插件,并且该插件将于2015年6月23日停止运行。 活动Feed会显示您网站上最有趣,最近的活动,使用您的朋友和其他人的操作(例如喜欢)。 https://developers.facebook.com/docs/plugins/activity

答案 3 :(得分:0)

您可以使用FB Javascript SDK

如果我没记错的话,如果用户已经为您的网站设置了facebook权限,那么这应该可行。或者你没有要求他们进行基本认证

FB.login(function(){
    FB.api('/v2.0/page_group_address_or_id/feed', 'GET', '', function(feedContent){
        // handle rendering the feed in what ever design you like
        console.log(feedContent);
    }); 
});

唯一的另一种方法是使用服务器端获取oAuth访问并使用您自己的访问令牌,尽管php向GraphAPI服务器发出请求