facebook api_Facebook API –获取朋友活动

于 2020-08-02 16:35:26 发布
阅读量298 收藏
点赞数
文章标签： javascript html js css web ViewUI
原文链接：https://www.script-tutorials.com/facebook-api-get-friends-activity/
版权

facebook api

Facebook API - Get friends activity
Facebook API - Get friends activity

Facebook API – Get friends activity Today I want to show you how to display activity feeds of your friends at your website. Ever wondered what your friends were doing on the Facebook Pages that you both like? Most of you can answer ‘yes’. And today we are going to display that activity feed at your website, I am going to use Facebook API (using fql.query). The result script can show us different feed types, for instance: status update, posted links, notes, photos, videos and other. Everything are located in ‘stream’ FQL table. So, let’s look to the realization.

Facebook API –今天获得朋友活动我想向您展示如何在您的网站上显示朋友的活动供稿。 有没有想过您的朋友在你们都喜欢的Facebook Pages上做什么？ 你们大多数人都可以回答“是”。 今天，我们将在您的网站上显示该活动供稿，我将使用Facebook API(使用fql.query)。 结果脚本可以向我们显示不同的提要类型，例如：状态更新，发布的链接，注释，照片，视频等。 一切都位于“流” FQL表中。 因此，让我们看一下实现。

Firstly, we should create our own new application at Facebook. Please follow this link and click ‘Create New App’ button at the left top:

首先，我们应该在Facebook上创建自己的新应用程序。 请点击此链接 ，然后点击左上角的“创建新应用”按钮：

Faceboog Friends API - step 1

Faceboog Friends API-步骤1

We should select our App Name and click ‘Continue’ button. We’ve just got our own api key:

我们应该选择我们的应用名称，然后单击“继续”按钮。 我们只有自己的api密钥：

Faceboog Friends API - step 2

Faceboog Friends API-步骤2

Now, please pay your attention to Basic Info block, we should type our App Domains and Site URL params:

现在，请注意“基本信息”块，我们应该输入“应用程序域”和“网站URL”参数：

Faceboog Friends API - step 3

Faceboog Friends API-步骤3

That’s all, click ‘Save Changes’ button, and lets start coding !

就是这样，单击“保存更改”按钮，然后开始编码！

现场演示

步骤1. PHP (Step 1. PHP)

Now, please create an empty index.php file and put next code:

现在，请创建一个空的index.php文件并放入下一个代码：

index.php (index.php)

<?php
$sApplicationId = 'YOUR_APPLICATION_ID';
$sApplicationSecret = 'YOUR_APPLICATION_SECRET';
$iLimit = 99;
?>
<!DOCTYPE html>
<html lang="en" xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
    <meta charset="utf-8" />
    <title>Facebook API - Get friends activity | Script Tutorials</title>
    <link href="css/main.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script>
        google.load("jquery", "1.7.1");
    </script>
    <script type="text/javascript" src="js/jsrender.js"></script>
    <!-- define template for our units -->
    <script id="facebookTemplate" type="text/x-jsrender">
        <div id="{{:post_id}}" class="fbf">
            {{if actor_id}}
                <img src="https://graph.facebook.com/{{:actor_id}}/picture" />
            {{/if}}
            <div>
                {{if description}}
                    <p><a href="{{:permalink}}">{{:description}}</a> <span>(Type: {{:type}})</span></p>
                {{/if}}
                {{if message}}
                    <p><a href="{{:permalink}}">{{:message}}</a> <span>(Type: {{:type}})</span></p>
                {{/if}}
            </div>
        </div>
    </script>
</head>
<body>
    <header>
        <h2>Facebook API - Get friends activity</h2>
        <a href="https://www.script-tutorials.com/facebook-api-get-friends-activity/" class="stuts">Back to original tutorial on <span>Script Tutorials</span></a>
    </header>
    <img src="facebook.png" class="facebook" alt="facebook" />
    <div id="fb-root"></div>
    <center>
        <h1>Authorization step:</h1>
        <div id="user-info"></div>
        <button id="fb-auth">Please login here</button>
    </center>
    <div id="results"></div>
    <script>
    window.fbAsyncInit = function() {
        FB.init({ appId: '<?= $sApplicationId ?>',
            status: true,
            cookie: true,
            xfbml: true,
            oauth: true
        });
        function updateButton(response) {
            var button = document.getElementById('fb-auth');
            if (response.authResponse) { // in case if we are logged in
                var userInfo = document.getElementById('user-info');
                var iPid = 0;
                FB.api('/me', function(response) {
                    userInfo.innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' + response.name;
                    button.innerHTML = 'Logout';
                    // get friends activity feed
                    iPid = response.id;
                    if (iPid > 0) {
                        FB.api({ // call fql.query
                            method : 'fql.query',
                            query : "SELECT post_id, actor_id, type, description, permalink, message FROM stream WHERE filter_key in (SELECT filter_key FROM stream_filter WHERE uid = me() AND type = 'newsfeed') AND type != '347'"
                        }, function(response) {
                            // render activity items using 'facebookTemplate' template
                            $('#results').html(
                                $('#facebookTemplate').render(response)
                            );
                        });
                    }
                });
                button.onclick = function() {
                    FB.logout(function(response) {
                        window.location.reload();
                    });
                };
            } else { // otherwise - dispay login button
                button.onclick = function() {
                    FB.login(function(response) {
                        if (response.authResponse) {
                            window.location.reload();
                        }
                    }, {scope:'read_stream'});
                }
            }
        }
        // run once with current status and whenever the status changes
        FB.getLoginStatus(updateButton);
        FB.Event.subscribe('auth.statusChange', updateButton);
    };
    (function() {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
    }());
    </script>
</body>
</html>


<?php
$sApplicationId = 'YOUR_APPLICATION_ID';
$sApplicationSecret = 'YOUR_APPLICATION_SECRET';
$iLimit = 99;
?>
<!DOCTYPE html>
<html lang="en" xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
    <meta charset="utf-8" />
    <title>Facebook API - Get friends activity | Script Tutorials</title>
    <link href="css/main.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script>
        google.load("jquery", "1.7.1");
    </script>
    <script type="text/javascript" src="js/jsrender.js"></script>
    <!-- define template for our units -->
    <script id="facebookTemplate" type="text/x-jsrender">
        <div id="{{:post_id}}" class="fbf">
            {{if actor_id}}
                <img src="https://graph.facebook.com/{{:actor_id}}/picture" />
            {{/if}}
            <div>
                {{if description}}
                    <p><a href="{{:permalink}}">{{:description}}</a> <span>(Type: {{:type}})</span></p>
                {{/if}}
                {{if message}}
                    <p><a href="{{:permalink}}">{{:message}}</a> <span>(Type: {{:type}})</span></p>
                {{/if}}
            </div>
        </div>
    </script>
</head>
<body>
    <header>
        <h2>Facebook API - Get friends activity</h2>
        <a href="https://www.script-tutorials.com/facebook-api-get-friends-activity/" class="stuts">Back to original tutorial on <span>Script Tutorials</span></a>
    </header>
    <img src="facebook.png" class="facebook" alt="facebook" />
    <div id="fb-root"></div>
    <center>
        <h1>Authorization step:</h1>
        <div id="user-info"></div>
        <button id="fb-auth">Please login here</button>
    </center>
    <div id="results"></div>
    <script>
    window.fbAsyncInit = function() {
        FB.init({ appId: '<?= $sApplicationId ?>',
            status: true,
            cookie: true,
            xfbml: true,
            oauth: true
        });
        function updateButton(response) {
            var button = document.getElementById('fb-auth');
            if (response.authResponse) { // in case if we are logged in
                var userInfo = document.getElementById('user-info');
                var iPid = 0;
                FB.api('/me', function(response) {
                    userInfo.innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' + response.name;
                    button.innerHTML = 'Logout';
                    // get friends activity feed
                    iPid = response.id;
                    if (iPid > 0) {
                        FB.api({ // call fql.query
                            method : 'fql.query',
                            query : "SELECT post_id, actor_id, type, description, permalink, message FROM stream WHERE filter_key in (SELECT filter_key FROM stream_filter WHERE uid = me() AND type = 'newsfeed') AND type != '347'"
                        }, function(response) {
                            // render activity items using 'facebookTemplate' template
                            $('#results').html(
                                $('#facebookTemplate').render(response)
                            );
                        });
                    }
                });
                button.onclick = function() {
                    FB.logout(function(response) {
                        window.location.reload();
                    });
                };
            } else { // otherwise - dispay login button
                button.onclick = function() {
                    FB.login(function(response) {
                        if (response.authResponse) {
                            window.location.reload();
                        }
                    }, {scope:'read_stream'});
                }
            }
        }
        // run once with current status and whenever the status changes
        FB.getLoginStatus(updateButton);
        FB.Event.subscribe('auth.statusChange', updateButton);
    };
    (function() {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
    }());
    </script>
</body>
</html>

Please pur your application id and secret in the beginning of our script, and only after let’s review our rest code. In the beginning I prepared a small html code:

请在我们的脚本开头(只有在我们回顾完其余代码之后)，才能提供您的应用程序ID和密码。 在开始时，我准备了一个小的html代码： 


<div id="fb-root"></div>
<center>
    <h1>Authorization step:</h1>
    <div id="user-info"></div>
    <button id="fb-auth">Please login here</button>
</center>
<div id="results"></div>


<div id="fb-root"></div>
<center>
    <h1>Authorization step:</h1>
    <div id="user-info"></div>
    <button id="fb-auth">Please login here</button>
</center>
<div id="results"></div>

We will display short info about logged in member in ‘user-info’ element. Also you can see here the same authorization elements as we made in our previous tutorial (Facebook API – Get friends list). Now, you should pay attention to the JavaScript code of obtaining Facebook friends activity feed:

我们将在“ user-info”元素中显示有关已登录成员的简短信息。 您还可以在这里看到与上一教程( Facebook API –成为朋友列表 )相同的授权元素。 现在，您应该注意获取Facebook朋友活动供稿JavaScript代码： 


// get friends activity feed
iPid = response.id;
if (iPid > 0) {
    FB.api({ // call fql.query
        method : 'fql.query',
        query : "SELECT post_id, actor_id, type, description, permalink, message FROM stream WHERE filter_key in (SELECT filter_key FROM stream_filter WHERE uid = me() AND type = 'newsfeed') AND type != '347'"
    }, function(response) {
        // render activity items using 'facebookTemplate' template
        $('#results').html(
            $('#facebookTemplate').render(response)
        );
    });
}


// get friends activity feed
iPid = response.id;
if (iPid > 0) {
    FB.api({ // call fql.query
        method : 'fql.query',
        query : "SELECT post_id, actor_id, type, description, permalink, message FROM stream WHERE filter_key in (SELECT filter_key FROM stream_filter WHERE uid = me() AND type = 'newsfeed') AND type != '347'"
    }, function(response) {
        // render activity items using 'facebookTemplate' template
        $('#results').html(
            $('#facebookTemplate').render(response)
        );
    });
}

You can ask me why I filtered type #347 – easy, it doesn’t contain anything interesting, this is ‘like’ type. Also, don’t forget, that we use JsRender library again in order to increase the rate of generation of the final HTML code.

您可以问我为什么过滤了＃347型-简单，它不包含任何有趣的东西，这是'like'类型。 另外，不要忘记，我们再次使用JsRender库是为了提高最终HTML代码的生成速度。

步骤2. CSS (Step 2. CSS)

In order to stylize our output I used next styles:

为了风格化我们的输出，我使用了以下样式： 


#results {
    margin: 0 auto;
    overflow: hidden;
    width: 550px;
}
.fbf {
    background-color: #F7F7F7;
    border: 1px solid #EEEEEE;
    border-radius: 5px 5px 5px 5px;
    clear: left;
    font-size: 1em;
    margin-bottom: 10px;
    overflow: hidden;
    padding: 5px 10px 5px 5px;
}
.fbf img {
    float: left;
    margin-right: 10px;
}
.fbf p {
    margin-bottom: 5px;
    overflow: hidden;
    text-align: left;
}
.fbf a:link, .fbf a:visited, .fbf a:focus, .fbf a:hover, .fbf a:active {
    color: #006699;
    font-size: 12px;
    font-weight: bold;
}
.fbf p span {
    float: right;
    font-size: 11px;
}


#results {
    margin: 0 auto;
    overflow: hidden;
    width: 550px;
}
.fbf {
    background-color: #F7F7F7;
    border: 1px solid #EEEEEE;
    border-radius: 5px 5px 5px 5px;
    clear: left;
    font-size: 1em;
    margin-bottom: 10px;
    overflow: hidden;
    padding: 5px 10px 5px 5px;
}
.fbf img {
    float: left;
    margin-right: 10px;
}
.fbf p {
    margin-bottom: 5px;
    overflow: hidden;
    text-align: left;
}
.fbf a:link, .fbf a:visited, .fbf a:focus, .fbf a:hover, .fbf a:active {
    color: #006699;
    font-size: 12px;
    font-weight: bold;
}
.fbf p span {
    float: right;
    font-size: 11px;
}
现场演示

[sociallocker]

[社交储物柜]

存档下载

[/sociallocker]

[/ sociallocker]

结论 (Conclusion)

I hope that everything is clean in today’s code. If you have any suggestions about further ideas for articles – you are welcome to share them with us. Good luck in your work!

我希望今天的代码中的所有内容都是干净的。 如果您对文章的进一步建议有任何建议，欢迎与我们分享。 祝您工作顺利！

翻译自: https://www.script-tutorials.com/facebook-api-get-friends-activity/

facebook api

cukeoumuqian0413
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
facebook api_Facebook API –获取朋友列表
cukeoumuqian0413的博客
08-02 1652
facebook apiFacebook API – Get friends list In our recent tutorials I told you how to import your contacts from google. Today I decided to make similar tutorial, but for facebook. I think that it can ...
使用java开发facebook网站应用程序 , facebook,facebookrestclient,页面,fbml,应用程序,调用,用户,密钥,应用,登陆
phphot
01-22 2880
当你想用Java写一Facebook的应用？你把在facebook的帐号中加入的程序开发模块，下载了相关的java类库。忽然你发现不得不停下来:开发相关的入门介绍，样例代码和文档说明在哪儿？这样的挫败感令人愤怒，而最终导致你不得不放弃。但愿有人会尽快写一个不错的应用Java 开发facebook应用的入门指南。也许只需要你给我些好吃的巧克力，我们可以写些相关的介绍文档，老实说我们的确也解决了不少
Facebook API 简介
weixin_33921089的博客
01-14 328
原文：http://www.ibm.com/developerworks/cn/xml/x-androidfacebookapi/index.html Facebook Platform API 概述 在介绍 Facebook SDK for Android 之前，有必要了解一下 Facebook Platform 及其 API。据 Facebook 声称，Facebook Platform ...
facebook 一些常用 api
zhao_my_love的专栏
10-24 9750
其实所有的api在官网上都有相应的文档，
Facebook API使用经验分享
weixin_30900589的博客
02-21 448
本例中没有使用Facebook API SDK，从底层展示了Facebook API的工作流程。 给出了一个这样的例子：如何在服务端中利用Facebook API获取到用户的email和好友列表。 1 申请Facebook API Key。 详细步骤，参考这篇文章：http://help.webscribble.com/display/jconnector/Getting+the+Fa...
Facebook_API_NET_Core
12-13
Facebook_API_NET_Core 是一个基于 .NET Core 的项目，利用 C# 语言实现了对 Facebook Graph API 的集成和交互。这个项目提供了完整的源代码，方便开发者学习和应用到自己的项目中。以下是一些关于该项目的关键知识...
Facebook-API.rar_C++_facebook
09-20
9. **应用审核**：对于某些敏感的API功能，如发布内容或获取用户的朋友列表，应用需要通过Facebook的审核流程。在提交审核之前，开发者应确保应用符合Facebook的开发政策。 10. **开发和测试环境**：Facebook提供了...
facebook_api
02-18
Facebook API 是一个强大的工具，允许开发者和用户获取与Facebook平台相关的各种信息数据。在这个特定的“facebook_api”项目中，核心功能是利用Facebook提供的访问令牌（Access Token）来获取报表数据，然后在谷歌...
facebook：Go专用的Facebook Graph API SDK
02-03
Golang中的Facebook Graph API SDK 这是一个Go软件包，完全支持以及文件上传，批处理请求和Marketing API。 可以在Google App Engine中使用。 API文档可以在上。 如果您在使用此软件包时有任何“如何做”的问题，...
facebook_login:这是使用Facebook图形API的FB登录
05-02
Facebook登入Facebook SDK https://connect.facebook.net/en_US/sdk.js提供HTML Drag index.html to browser.谢谢你。
facebook FB.api()使用
Curry_liang
12-21 4470
1、FB.api(url, method, params, callback); #get objects 2、FB.api('/me?fields=id,name,gender'); //查询 me 节点的字段：id，name，gender(性别)，posts(发布的动态) #create objects 3、FB.api('/me/feed', 'POST', {'message'
关于Facebook API 获取Page主页的永久access_token
weixin_33893473的博客
12-11 1463
2019独角兽企业重金招聘Python工程师标准>>> ...
3、Facebook图谱API的使用方法整理
热门推荐
Curry_liang
02-16 1万+
概览： 图谱 API 是存取 Facebook 开放平台数据的主要方式。它是一种以 HTTP 为基础的轻量级 API，可用于查询数据、发布新动态、管理广告、上传照片和完成一款应用可能需要执行的各种其他任务。 Facebook信息组成： 节点 — 用户、照片、主页、评论等基本“事物” 连线 — 上述“事物”之间的联系，例如：主页照片或照片的评论 字段 — 关于上述“事物
通过Javascript Facebook API获取Facebook用户信息,以及当前用户的好友
weixin_30655219的博客
01-17 876
作者: 东来东往来源: http://www.dldw.net/archives/25.html最近为客户做一个新的Facebook APP页面.说一下如何获取Facebook用户的信息,例如facebookID,name,pic_square,movies,email,current_location等信息.在使用APP之前需要先生成Facebook APP ID 这不必多说.生成Faceboo...
Facebook三种分享方式
weixin_30532837的博客
04-11 685
一、去Facebook开发者中心注册APP，获取APP ID https://developers.facebook.com 二、导入 FBSDKCoreKit.Framework, FBSDKLoginKit.Framework, FBSDKShareKit.Framework 三、在info.plist 文件中加入 <key>CFBund...
如何使用 Facebook Graph API Explorer 工具来获取访问令牌
最新发布
06-08
使用 Facebook Graph API Explorer 工具来获取访问令牌，可以按照以下步骤进行： 1. 打开 Facebook Graph API Explorer 工具页面：https://developers.facebook.com/tools/explorer/ 2. 登录你的 Facebook 账号。 3. 在工具页面的顶部，选择你要进行 API 操作的应用程序。 4. 在页面右上方的“Get User Access Token”下拉菜单中，选择你需要的访问权限，然后点击“Get Access Token”按钮。 5. 根据你选择的访问权限，Facebook 会向你显示一个带有所需权限的访问令牌。 6. 如果你需要访问某个 Facebook 页面的数据，可以将该页面的 ID 复制到“Page Access Token”文本框中，并按照提示操作即可获取该页面的访问令牌。 获取访问令牌后，你就可以使用 Facebook Graph API Explorer 工具来进行数据查询和操作了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值